<template>
  <div class="revset page-miH page-bgBack">
    <a-layout>
      <PageHeader @back="goback" subTitle="返回"> 增减员计划 </PageHeader>

      <div class="flex-center-between pb12" style="margin-top: 20px">
        <div
          class="wb19 border_hover h75 color_fa border_dashed top_warp"
          v-for="(item, index) in topData"
          :key="index"
          style="padding-left: 24px"
          :class="active === index ? 'border_active' : ''"
          @click="onTopTabs(index)"
        >
          <img :src="item.url" style="width: 32px; height: 32px" :alt="item.title" />
          <div>
            <div class="top_title">{{ item.title }}</div>
            <CountTo :startVal="0" :endVal="item.num" :duration="2000" class="top_number" />
            <div></div>
          </div>
        </div>
      </div>

      <!-- 表单筛选 -->
      <div class="headbttw">
        <a-row class="mt24 mb30">
          <a-input-search
            v-model="searchName"
            class="mr12"
            placeholder="搜索姓名/身份证号"
            style="width: 200px"
            @search="handleSearch"
            allowClear
          />

          <!-- <a-select title class="mr12" style="width: 145px" placeholder="人员类型" allow-clear @change="handlePersonType">
            <a-select-option v-for="item in personTypeList" :key="item.id" style>{{ item.value }}</a-select-option>
          </a-select>
          <a-select title class="mr12" style="width: 136px" placeholder="参保方案" allow-clear @change="handleProgName">
            <a-select-option v-for="item in progNameList" :key="item.socProgItemVOList[0].progId" style>{{
              item.progName
            }}</a-select-option>
          </a-select>
          <city
            placeholder="参保城市"
            :level="3"
            :default-value="socCity"
            style="min-width: 130px; width: 130px"
            :allow-clear="true"
            @change="handleCity($event)"
          />
          <a-month-picker placeholder="计划增减员时间" style="margin-left: 20px;width: 150px" @change="handleProgTime" /> -->

          <a-popover v-model="searchVisible" title trigger="click" placement="bottom" style="cursor: pointer">
            <div slot="content" style="width: 500px">
              <a-row type="flex" justify="space-around" style="margin-bottom: 20px">
                <a-col :span="7">
                  <!-- <a-form-model-item ref="formalType" prop="formalType" label="人员类型">
                      <a-select v-model="form.formalType" :allow-clear="true">
                        <a-select-option v-for="item in personTypeList" :key="item.id" style>{{ item.value }}</a-select-option>
                        <a-select-option :key="1" :value="1">试用</a-select-option>
                        <a-select-option :key="2" :value="2">正式</a-select-option>
                      </a-select>
                    </a-form-model-item> -->
                  <a-select title class="mr12" style="width: 145px" placeholder="人员类型" allow-clear @change="handlePersonType">
                    <a-select-option v-for="item in personTypeList" :key="item.id" style>{{ item.value }}</a-select-option>
                  </a-select>
                </a-col>
                <a-col :span="7">
                  <!-- <a-form-model-item ref="gender" prop="gender" label="性别">
                      <a-select v-model="form.gender" :allow-clear="true">
                        <a-select-option :key="1" :value="1">男</a-select-option>
                        <a-select-option :key="2" :value="2">女</a-select-option>
                      </a-select>
                    </a-form-model-item> -->
                  <a-select title class="mr12" style="width: 136px" placeholder="参保方案" allow-clear @change="handleProgName">
                    <a-select-option v-for="item in progNameList" :key="item.socProgItemVOList[0].progId" style>{{
                      item.progName
                    }}</a-select-option>
                  </a-select>
                </a-col>
                <a-col :span="7">
                  <!-- <a-form-model-item ref="highestEducation" prop="highestEducation" label="学历">
                      <a-select v-model="form.highestEducation" :allow-clear="true">
                        <a-select-option v-for="(item, index) in highestEducation" :key="index" :value="item.label">{{
                          item.label
                        }}</a-select-option>
                      </a-select>
                    </a-form-model-item> -->
                  <city
                    placeholder="参保城市"
                    :level="3"
                    :default-value="socCity"
                    style="min-width: 130px; width: 130px"
                    :allow-clear="true"
                    @change="handleCity($event)"
                  />
                </a-col>
              </a-row>
              <a-row type="flex" justify="space-around" style="margin-bottom: 20px">
                <a-col :span="7">
                  <a-month-picker placeholder="计划增减员时间" style="width: 150px" @change="handleProgTime" />
                </a-col>
                <a-col :span="7">
                  <a-select title class="mr12" style="width: 136px" placeholder="增减员类型" allow-clear @change="handleType">
                    <a-select-option :key="1" :value="1">社保</a-select-option>
                    <a-select-option :key="3" :value="3">医保</a-select-option>
                    <a-select-option :key="2" :value="2">公积金</a-select-option>
                  </a-select>
                </a-col>
                <a-col :span="7">
                  <a-select title class="mr12" style="width: 136px" placeholder="计划状态" allow-clear @change="handlePlanType">
                    <a-select-option :key="0" :value="0">待反馈</a-select-option>
                    <a-select-option :key="1" :value="1">已成功</a-select-option>
                    <a-select-option :key="2" :value="2">已失败</a-select-option>
                    <a-select-option :key="3" :value="3">已取消</a-select-option>
                  </a-select>
                </a-col>
              </a-row>
              <a-row type="flex" justify="end">
                <a-button style="margin-right: 12px" @click="handleCancel2">取消</a-button>
                <a-button type="primary" @click="handleFormSearch">查询</a-button>
              </a-row>
            </div>
            <a-icon type="filter" />
          </a-popover>
        </a-row>

        <div>
          <a-button v-if="site.socConfirm" type="primary" class="ml12" @click="shebaopaidan">社保派单</a-button>
          <a-button v-if="site.socConfirm" type="primary" class="ml12" @click="ZongjianyuanSure"> 增减员反馈 </a-button>
          <a-button type="primary" class="ml12" @click="piLiangDaoRu"> <a-icon type="plus" />增员 </a-button>
          <a-button type="primary" class="ml12" @click="toSetshebao"> <a-icon type="minus" />减员 </a-button>
          <a-button type="primary" class="ml12" @click="btzengyuan"> 批量增员 </a-button>
          <a-button type="primary" class="ml12" @click="btjianyuan"> 批量减员 </a-button>
        </div>
      </div>

      <!-- table展示 -->
      <a-row>
        <a-table
          :columns="columnDetail"
          :pagination="pagination"
          :data-source="dataDetail"
          :scroll="{ x: columnDetail.length * 200 }"
          size="middle"
          colspan="0"
          class="mt12"
          @change="handlePageChange"
          :row-selection="{
            selectedRowKeys: selectedRowKeys,
            onChange: onSelectChange
          }"
        >
          <template slot="companySocAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="feedbackFlag" slot-scope="text, record">
            <span v-if="!record.feedbackFlag" style="color: #ffa600">•</span>
            <span v-if="record.feedbackFlag === 1" style="color: #24cdaa">•</span>
            <span v-if="record.feedbackFlag === 2" style="color: #fa5051">•</span>
            <span v-if="record.feedbackFlag === 3" style="color: #aeb5bf">•</span>
            <span>{{
              record.feedbackFlag ? (record.feedbackFlag === 1 ? " 已成功" : record.feedbackFlag === 2 ? " 已失败" : " 已取消") : " 待反馈"
            }}</span>
          </template>

          <template slot="type" slot-scope="text">
            <span>{{ text === 1 ? "社保" : text === 2 ? "公积金" : "医保" }}</span>
          </template>
          <template slot="personalSocAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="companyPfAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="personalPfAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="serviceCost" slot-scope="text, record">
            <span>{{ record.serviceCost !== null ? record.serviceCost : "-" }}</span>
          </template>

          <template slot="schemeName" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="socCityName" slot-scope="text, record">
            <a-tooltip placement="top">
              <template slot="title">
                {{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}
              </template>
              <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
            </a-tooltip>
          </template>

          <template slot="businessType" slot-scope="text">
            <span>{{ text != null ? (text === "1" ? "增加/开户" : "调入/续保") : "-" }}</span>
          </template>

          <template slot="socOrStopSocDate" slot-scope="text, record">
            <span>{{ formatDate2(record.socOrStopSocDate) }}</span>
          </template>

          <template slot="postType" slot-scope="text">
            <span>{{ $store.state.enums.postTypeArr[text - 1] }}</span>
          </template>
          <template slot="empSocState" slot-scope="text">
            <div style="display: flex; flex-flow: column">
              <div>{{ getPostType(text) }}</div>
            </div>
          </template>
          <template slot="opration" slot-scope="text, text1">
            <a-button
              v-if="!text1.feedbackFlag"
              v-bind:disable="text1.empSocState === 0 || text1.empSocState === 1 || text1.empSocState === 6"
              size="small"
              type="link"
              @click="edito(text1)"
            >
              编辑
            </a-button>
            <a-button
              v-if="!text1.feedbackFlag"
              v-bind:disable="text1.empSocState === 0 || text1.empSocState === 1 || text1.empSocState === 6"
              size="small"
              type="link"
              @click="goDetail(text1)"
            >
              反馈
            </a-button>

            <a-button
              v-if="text1.feedbackFlag === 1"
              v-bind:disable="text1.empSocState === 0 || text1.empSocState === 1 || text1.empSocState === 6"
              size="small"
              type="link"
              @click="lookPlan(text1)"
            >
              查看计划
            </a-button>
            <a-button
              v-if="text1.feedbackFlag === 2"
              v-bind:disable="text1.empSocState === 0 || text1.empSocState === 1 || text1.empSocState === 6"
              size="small"
              type="link"
              @click="lookReason(text1)"
            >
              查看原因
            </a-button>
            <a-button
              v-if="text1.feedbackFlag === 2"
              v-bind:disable="text1.empSocState === 0 || text1.empSocState === 1 || text1.empSocState === 6"
              size="small"
              type="link"
              @click="edito(text1)"
            >
              重新提交
            </a-button>
            <a-button
              v-if="text1.feedbackFlag === 3"
              v-bind:disable="text1.empSocState === 0 || text1.empSocState === 1 || text1.empSocState === 6"
              size="small"
              type="link"
              @click="edito(text1)"
            >
              重新提交
            </a-button>
          </template>
        </a-table>
      </a-row>
      <a-modal v-model="shebaopaidanVisible" title="社保派单" width="1000px" @ok="onShebaopaidanOk">
        <a-alert
          message="将增减员计划分派给对应社保专员，被分配人员在首页工作台进行接单反馈操作，接单反馈完成后，派单的用工单位中增减员计划同步更新"
          banner
        />
        <div class="fs16 fw500 mt16">本次派单 {{ selectedRows.length }} 人</div>
        <a-form-item label="接单人" :labelCol="{ span: 2 }" :wrapperCol="{ span: 16 }" class="mt16" style="margin-left: -20px">
          <a-select
            v-model="shebaopaidanAdmin"
            :options="queryUserListLessToMeList"
            optionFilterProp="label"
            :filterOption="filterOption"
            placeholder="请选择"
            mode="multiple"
            style="width: 236px"
          />
        </a-form-item>
        <a-table
          :columns="columnDetailNoAction"
          :pagination="false"
          :data-source="selectedRows"
          :scroll="{ x: columnDetailNoAction.length * 200 }"
          size="middle"
          colspan="0"
          @change="handlePageChange"
        >
          <template slot="companySocAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="feedbackFlag" slot-scope="text, record">
            <span v-if="!record.feedbackFlag" style="color: #ffa600">•</span>
            <span v-if="record.feedbackFlag === 1" style="color: #24cdaa">•</span>
            <span v-if="record.feedbackFlag === 2" style="color: #fa5051">•</span>
            <span v-if="record.feedbackFlag === 3" style="color: #aeb5bf">•</span>
            <span>{{
              record.feedbackFlag ? (record.feedbackFlag === 1 ? " 已成功" : record.feedbackFlag === 2 ? " 已失败" : " 已取消") : " 待反馈"
            }}</span>
          </template>

          <template slot="type" slot-scope="text">
            <span>{{ text === 1 ? "社保" : text === 2 ? "公积金" : "医保" }}</span>
          </template>
          <template slot="personalSocAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="companyPfAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="personalPfAmount" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="serviceCost" slot-scope="text, record">
            <span>{{ record.serviceCost !== null ? record.serviceCost : "-" }}</span>
          </template>

          <template slot="schemeName" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>
          <template slot="socCityName" slot-scope="text, record">
            <a-tooltip placement="top">
              <template slot="title">
                {{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}
              </template>
              <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
            </a-tooltip>
          </template>

          <template slot="businessType" slot-scope="text">
            <span>{{ text != null ? (text === "1" ? "增加/开户" : "调入/续保") : "-" }}</span>
          </template>

          <template slot="socOrStopSocDate" slot-scope="text, record">
            <span>{{ formatDate2(record.socOrStopSocDate) }}</span>
          </template>

          <template slot="postType" slot-scope="text">
            <span>{{ $store.state.enums.postTypeArr[text - 1] }}</span>
          </template>
          <template slot="empSocState" slot-scope="text">
            <div style="display: flex; flex-flow: column">
              <div>{{ getPostType(text) }}</div>
            </div>
          </template>
          <template slot="opration" slot-scope="text, record">
            <a-button type="link" @click="removeSelected(record)">删除</a-button>
          </template>
        </a-table>
      </a-modal>
      <!-- 员工选择 -->
      <employee-select :show.sync="isChooseStaff" :zengyuan="zengyuanOrJianyuan" @change="onEmployeeSelectChange" @cancel="handleCancel" />

      <a-modal :title="zengyuanOrJianyuan ? '增员' : '减员'" :visible="Dvisible" @cancel="handleCancel" :confirm-loading="confirmLoading">
        <template slot="footer">
          <a-button @click="DhandleCancel"> 上一步 </a-button>
          <a-button type="primary" @click="DhandleOk"> 确定 </a-button>
        </template>
        <div class="rowdalog2">
          <img style="width: 30px; height: 30px; margin-right: 10px" src="@/assets/icons/ask.png" />

          <div v-if="zengyuanOrJianyuan" style="margin-top: 4px; color: #3c3d43; font-size: 16px; font-weight: 400">
            增员后社保将有较大金额变动，确定添加{{ staffList.length }}人？
          </div>
          <div v-else style="margin-top: 4px; color: #3c3d43; font-size: 16px; font-weight: 400">
            减员后社保将有较大金额变动，确定添加{{ staffList.length }}人进行减员？
          </div>
        </div>
      </a-modal>

      <a-modal title="提示" :visible="removeZengVisible" @cancel="handleCancel" @ok="remvoeZenyuanOkHandel">
        <div class="rowdalog2">
          <img style="width: 30px; height: 30px; margin-right: 10px; margin-left: 40px" src="@/assets/icons/ask.png" />

          <div
            style="margin-top: 4px; color: #3c3d43; font-size: 16px; font-weight: 400"
            v-if="tempEmpSocStatus === 2 || tempEmpSocStatus === 3"
          >
            取消增员后将回到未参保状态，是否取消增员？
          </div>
          <div
            style="margin-top: 4px; color: #3c3d43; font-size: 16px; font-weight: 400"
            v-if="tempEmpSocStatus === 4 || tempEmpSocStatus === 5"
          >
            取消减员后将回到正常参保状态，是否取消减员？
          </div>
        </div>
      </a-modal>

      <a-modal :title="zengyuanOrJianyuan ? '增员' : '减员'" :visible="Lvisible" width="600px" @cancel="LhandleOk">
        <template slot="footer">
          <a-button type="primary" @click="LhandleOk"> 确定 </a-button>
        </template>

        <div v-if="zengyuanOrJianyuan" class="rowdialog">
          <img style="width: 32px; height: 32px; margin-left: 10px" src="@/assets/img/overviewContract/icon4.png" />
          <div style="color: #3c3d43; font-size: 16px; margin-left: 10px">增员计划添加成功</div>
        </div>
        <div v-if="zengyuanOrJianyuan">
          <!-- <div style="color: #767885; font-size: 13px; margin-left: 52px">官网操作后，需在系统内进行增员确认确认后，</div> -->
          <div style="color: #767885; font-size: 13px; margin-left: 52px; margin-top: 5px">增员名单可在{{ tempDate }}参保管理中查看</div>
        </div>

        <div v-if="!zengyuanOrJianyuan" class="rowdialog">
          <img style="width: 32px; height: 32px; margin-left: 10px" src="@/assets/img/overviewContract/icon4.png" />
          <div style="color: #3c3d43; font-size: 16px; margin-left: 10px">减员计划添加成功，查看计划请前往增减员计划内进行确认</div>
        </div>
        <div v-if="!zengyuanOrJianyuan">
          <div style="color: #3c3d43; font-size: 16px; margin-left: 0px; margin-top: 40px; margin-bottom: 10px">减员计划结果</div>
          <a-table
            :columns="columnDialogDetailJianYuan"
            :pagination="pagination2"
            :data-source="dataDetail4"
            :scroll="{ x: 600 }"
            colspan="0"
            row-key="id"
            @change="handlePageChange2"
          >
            <template slot="socDescription" slot-scope="text, record">
              <a-tooltip>
                <template slot="title">
                  {{ record.socDescription ? record.socDescription : "--" }}
                </template>
                <span>{{ record.socDescription ? record.socDescription : "--" }}</span>
              </a-tooltip>
            </template>
            <template slot="meDescription" slot-scope="text, record">
              <a-tooltip>
                <template slot="title">
                  {{ record.meDescription ? record.meDescription : "--" }}
                </template>
                <span>{{ record.meDescription ? record.meDescription : "--" }}</span>
              </a-tooltip>
            </template>
            <template slot="pfDescription" slot-scope="text, record">
              <a-tooltip>
                <template slot="title">
                  {{ record.pfDescription ? record.pfDescription : "--" }}
                </template>
                <span>{{ record.pfDescription ? record.pfDescription : "--" }}</span>
              </a-tooltip>
            </template>
          </a-table>
        </div>
      </a-modal>

      <!-- 选择参保方案 -->
      <a-modal
        :title="editPlan ? '编辑增员信息' : '增员'"
        :visible="isCloseMethod"
        width="690px"
        :destroy-on-close="true"
        @cancel="handleCancel"
      >
        <template slot="footer">
          <a-button
            type="danger"
            ghost
            v-if="editPlan && (tempEmpSocStatus === 2 || tempEmpSocStatus === 3) && currentItem.feedbackFlag !== 3"
            @click="cancelZengY"
          >
            {{ getStatusTitle() }}
          </a-button>
          <a-button @click="handleCancel" v-if="!editPlan"> 取消 </a-button>
          <a-button type="primary" @click="finishEdit">
            {{ editPlan ? "确定" : "下一步" }}
          </a-button>
        </template>

        <div style="padding: 0 56px">
          <a-form :label-col="{ span: 7 }" :wrapper-col="{ span: 15 }">
            <a-form-item class="baseInfo-item" label="参保时间">
              <a-month-picker
                :default-value="getDefaultValue()"
                @change="onYearMonthChange"
                :disabled-date="disabledDate"
                :allowClear="false"
                style="width: 100%"
              />
              <div style="color: #a6a8b4; font-size: 10px; margin-top: -10px; margin-left: 0px">
                若需对之前月份进行补收，请前往社保名单进行设置
              </div>
            </a-form-item>

            <a-form-item class="baseInfo-item" label="参保方案">
              <a-select
                style="width: 66%"
                :value="defaultFangan === 0 ? '请选择参保方案' : defaultFangan"
                @change="chooseProgName"
                placeholder="请选择参保方案"
              >
                <a-select-option v-for="item in editPlan ? getProgNameList() : progNameList" :key="item.id">{{
                  item.progName
                }}</a-select-option>
              </a-select>
              <a-button type="primary" class="ml12" @click="addFangan" ghost> 新增方案 </a-button>
            </a-form-item>

            <div>
              <a-checkbox
                @change="onTypeChange1"
                :checked="addShebao"
                v-if="!editPlan && hasShebao(formData)"
                style="margin-bottom: 18px; margin-left: 105px; margin-top: 10px"
              >
                社保增员
              </a-checkbox>

              <a-form :label-col="{ span: 7 }" :wrapper-col="{ span: 15 }" class="baseInfo" v-if="addShebao || editPlan">
                <template v-for="(item, index) in formData">
                  <a-form-item v-if="item.itemType === 1" :key="index" :label="item.itemName + '基数'" class="baseInfo-item">
                    <a-input-number
                      :value="
                        onlySocAmount
                          ? item.cardinalityDefaultAmount
                            ? item.cardinalityDefaultAmount
                            : item.cardinalityDefault
                          : item.cardinalityDefault
                      "
                      :max="useSocImport ? 99999999 : item.cardinalityMax"
                      :min="useSocImport ? 0 : item.cardinalityMin"
                      @change="(val) => changeDefault(val, index)"
                    />
                    <span style="margin-left: 0" v-if="!onlySocAmount"> 基数范围[{{ item.cardinalityMin }}-{{ item.cardinalityMax }}]</span>
                  </a-form-item>
                </template>
              </a-form>
            </div>
            <div>
              <a-checkbox
                @change="onTypeChange2"
                :checked="addYibao"
                v-if="!editPlan && hasYibao(formData)"
                style="margin-bottom: 18px; margin-left: 105px; margin-top: 10px"
              >
                医保增员
              </a-checkbox>
              <!-- <div style="margin-bottom:15px;margin-left:50px;color:#000000;font-weight:700;" v-if="getItemType(3)">
              医保各项目基数
            </div> -->

              <a-form :label-col="{ span: 7 }" :wrapper-col="{ span: 15 }" class="baseInfo" v-if="addYibao || editPlan">
                <template v-for="(item, index) in formData">
                  <a-form-item v-if="item.itemType === 3" :key="index" :label="item.itemName + '基数'" class="baseInfo-item">
                    <a-input-number
                      :value="
                        onlySocAmount
                          ? item.cardinalityDefaultAmount
                            ? item.cardinalityDefaultAmount
                            : item.cardinalityDefault
                          : item.cardinalityDefault
                      "
                      :max="useMeImport ? 99999999 : item.cardinalityMax"
                      :min="useMeImport ? 0 : item.cardinalityMin"
                      @change="(val) => changeDefault(val, index)"
                    />
                    <span style="margin-left: 0" v-if="!onlySocAmount"> 基数范围[{{ item.cardinalityMin }}-{{ item.cardinalityMax }}]</span>
                  </a-form-item>
                </template>
              </a-form>
            </div>

            <div v-if="!payProvidentFund && progNameList.length > 0">
              <a-checkbox
                @change="onTypeChange3"
                :checked="addGjj"
                v-if="!editPlan"
                style="margin-bottom: 18px; margin-left: 105px; margin-top: 10px"
              >
                公积金增员
              </a-checkbox>
              <!-- <div style="margin-bottom:15px;margin-left:50px;color:#000000;font-weight:700;" v-if="getItemType(2)">
                公积金各项基数
              </div> -->
              <a-form :label-col="{ span: 7 }" :wrapper-col="{ span: 15 }" class="baseInfo" v-if="addGjj || editPlan">
                <template v-for="(item, index) in formData">
                  <a-form-item v-if="item.itemType === 2" :key="index" :label="item.itemName + '基数'" class="baseInfo-item">
                    <a-input-number
                      :value="
                        onlySocAmount
                          ? item.cardinalityDefaultAmount
                            ? item.cardinalityDefaultAmount
                            : item.cardinalityDefault
                          : item.cardinalityDefault
                      "
                      :max="usePfImport ? 99999999 : item.cardinalityMax"
                      :min="usePfImport ? 0 : item.cardinalityMin"
                      @change="(val) => changeDefault(val, index)"
                    />
                    <span style="margin-left: 0" v-if="!onlySocAmount"> 基数范围[{{ item.cardinalityMin }}-{{ item.cardinalityMax }}]</span>
                  </a-form-item>
                </template>
              </a-form>
            </div>
            <a-form-item class="baseInfo-item" label="服务费">
              <a-input-number v-model="serviceCost" placeholder="每月服务费" :min="0" />
            </a-form-item>
          </a-form>
        </div>
      </a-modal>
      <a-modal
        :title="editPlan ? '编辑减员信息' : '减员'"
        :visible="isJCloseMethod"
        :width="editPlan ? '600px' : '800px'"
        :destroy-on-close="true"
        @cancel="handleCancel"
      >
        <template slot="footer">
          <a-button
            type="danger"
            ghost
            v-if="editPlan && (tempEmpSocStatus === 4 || tempEmpSocStatus === 5) && currentItem.feedbackFlag !== 3"
            @click="cancelJianY"
          >
            {{ getStatusTitle() }}
          </a-button>
          <a-button @click="handleCancel" v-if="!editPlan"> 取消 </a-button>
          <a-button type="primary" @click="finishEdit">
            {{ editPlan ? "确定" : "下一步" }}
          </a-button>
        </template>

        <div>
          <a-form :label-col="{ span: 5 }" :wrapper-col="{ span: 7 }">
            <a-checkbox
              @change="onTypejianChange1"
              :checked="jianShebao"
              :disabled="jianShebao_2"
              v-if="!editPlan && stopyear !== '' && stopmonth !== ''"
              style="margin-left: 245px; margin-top: 15px; margin-bottom: 15px"
            >
              社保减员
            </a-checkbox>
            <a-form-item class="baseInfo-item" label="社保停保年月" v-if="stopyear !== '' && stopmonth !== ''">
              <a-month-picker
                style="width: 180px"
                :allowClear="false"
                :value="moment(stopyear + '-' + stopmonth, monthFormat)"
                @change="onStopYearMonthChange"
                :disabled-date="disabledDate"
                :disabled="!jianShebao && !editPlan"
              />
            </a-form-item>
            <a-checkbox
              @change="onTypejianChange2"
              :checked="jianYibao"
              :disabled="jianYibao_2"
              v-if="!editPlan && stopYByear !== '' && stopYBmonth !== ''"
              style="margin-left: 245px; margin-top: 15px; margin-bottom: 15px"
            >
              医保减员
            </a-checkbox>
            <a-form-item class="baseInfo-item" label="医保停保年月" v-if="stopYByear !== '' && stopYBmonth !== ''">
              <a-month-picker
                style="width: 180px"
                :allowClear="false"
                :value="moment(stopYByear + '-' + stopYBmonth, monthFormat)"
                @change="onStopYBYearMonthChange"
                :disabled-date="disabledDate"
                :disabled="!jianYibao && !editPlan"
              />
            </a-form-item>
            <a-checkbox
              @change="onTypejianChange3"
              :checked="jianGjj"
              :disabled="jianGjj_2"
              v-if="!editPlan && stopGjyear !== '' && stopGjmonth !== ''"
              style="margin-left: 245px; margin-top: 15px; margin-bottom: 15px"
            >
              公积金减员
            </a-checkbox>
            <a-form-item class="baseInfo-item" label="公积金封存年月" v-if="stopGjyear !== '' && stopGjmonth !== ''">
              <a-month-picker
                style="width: 180px"
                :allowClear="false"
                :value="moment(stopGjyear + '-' + stopGjmonth, monthFormat)"
                @change="onStopGJYearMonthChange"
                :disabled-date="disabledDate"
                :disabled="!jianGjj && !editPlan"
              />
            </a-form-item>

            <div
              style="color: #a6a8b4; font-size: 10px; margin-top: -10px; margin-left: 345px"
              v-if="!editPlan && stopGjyear !== '' && stopGjmonth !== ''"
            >
              如仅停缴公积金，请前往新建无参保公积金方案
            </div>
            <a-form-item class="baseInfo-item" label="服务费">
              <a-input-number
                v-model="JYserviceCost"
                placeholder="请输入服务费"
                :min="0"
                :precision="2"
                :disabled="!editPlan && (jianShebao || jianYibao || jianGjj) === false"
                style="width: 180px"
              />
            </a-form-item>
          </a-form>
          <div v-if="!editPlan" class="marginL2">服务费不填写默认不更改，填0即服务费改为0</div>
        </div>
      </a-modal>
      <a-modal
        title="请登录"
        :visible="accModel"
        width="600px"
        @cancel="
          () => {
            this.accModel = false;
          }
        "
      >
        <template slot="footer">
          <a-button
            @click="
              () => {
                this.accModel = false;
              }
            "
          >
            取消
          </a-button>
          <a-button type="primary" @click="confirmAccHandel" :disabled="spinning">
            {{ spinning ? "数据同步中" : "继续同步" }}
          </a-button>
        </template>
        <a-form-item class="baseInfo-item" label="直通车账号:" required>
          <a-input v-model="shebaoAcc" placeholder="请输入直通车账号" />
        </a-form-item>
        <a-form-item class="baseInfo-item" label="直通车密码:" required>
          <a-input v-model="shebaoPassW" placeholder="请输入直通车密码" />
        </a-form-item>
      </a-modal>
      <!-- 确认增减员 -->
      <a-modal
        :spinning="spinning"
        :title="confirmPlanZeng ? '增员计划反馈' : '减员计划反馈'"
        :visible="isConfirmPlan"
        width="800px"
        :destroy-on-close="true"
        @cancel="handleCancel"
      >
        <template slot="footer">
          <a-button @click="handleCancel"> 取消 </a-button>
          <a-button type="primary" @click="confirmOk" :disabled="spinning || (biaoji === '计划同步' && !shebaoLogin.isLogin)">
            {{ spinning ? "数据校验中" : "确认" }}
          </a-button>
        </template>

        <div style="margin-bottom: 0px">
          <a-form>
            <div class="headerTitle">
              <div class="block" />
              <div class="title-info">人员列表</div>
            </div>
            <a-table
              :columns="columnDialogDetail"
              :pagination="pagination2"
              :data-source="dataDetail3"
              :scroll="{ x: 700 }"
              colspan="0"
              row-key="id"
              @change="handlePageChange2"
            >
              <template slot="socOrStopSocDate" slot-scope="text, record">
                <span>{{ formatDate3(record.socOrStopSocDate) }}</span>
              </template>
              <template slot="serviceCost" slot-scope="text, record">
                <span>{{ record.serviceCost !== null ? record.serviceCost : "-" }}</span>
              </template>
              <template slot="empSocState" slot-scope="record">
                <div style="display: flex; flex-flow: column">
                  <div>{{ getPostType(record) }}</div>
                </div>
              </template>
              <template slot="postType" slot-scope="text">
                <span>{{ $store.state.enums.postTypeArr[text - 1] }}</span>
              </template>
              <template slot="schemeName" slot-scope="text, record">
                <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
              </template>
              <template slot="socCityName" slot-scope="text, record">
                <a-tooltip placement="top">
                  <template slot="title">
                    <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
                  </template>
                  <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
                </a-tooltip>
              </template>
            </a-table>
            <div class="headerTitle">
              <div class="block" />
              <div class="title-info">计划操作</div>
            </div>
            <div v-if="biaoji === '计划反馈'" style="font-size: 14px; color: #252525; font-weight: 700">
              {{ confirmPlanZeng ? "增员计划是否已执行？" : "减员计划是否已执行？" }}
            </div>
            <a-form-item class="baseInfo-item2" v-if="biaoji === '计划反馈'">
              <a-radio-group v-model="typeValueTime" @change="onTypeChangeValue">
                <a-radio :value="1"> 执行成功 </a-radio>
                <a-radio :value="2" style="margin-left: 30px"> 执行失败 </a-radio>
              </a-radio-group>
            </a-form-item>
            <a-form-item label="备注">
              <a-textarea
                v-if="biaoji === '计划反馈'"
                style="width: 100%; margin-bottom: 20px"
                :rows="3"
                v-model="feedbackContent"
                :maxLength="200"
                placeholder="请输入备注（不得超过200字）"
              />
            </a-form-item>
            <a-form-item label="附件">
              <UploadGeneralInline v-model="annex" accept=".doc, .docx, .xls, .xlsx, .pdf, .zip, .rar, .jpg, .jpeg, .png" :limit="10">
                <div slot="list" slot-scope="{ list }">
                  <PreviewItem v-for="item in list" :key="'' + item.uid" :url="item.url" :size="128" style="width: 238px" />
                </div>
              </UploadGeneralInline>
            </a-form-item>

            <div v-if="biaoji === '计划同步'" style="font-size: 14px; color: #252525; font-weight: 700">将增员结果同步至社保网站</div>
            <div style="font-size: 12px; color: #a6a8b4" v-if="biaoji === '计划同步'">
              *仅支持在青岛进行社保增员的员工信息同步。请在每月15日前进行社保信息同步。
            </div>
            <a-divider v-if="biaoji === '计划同步'" style="margin-top: 15px; margin-bottom: -1px" />
            <a-form-item label="选择城市" required v-if="biaoji === '计划同步'">
              <a-select
                :default-value="defaultFangan2 === 0 ? '请选择社保所在城市' : defaultFangan2"
                style="width: 35%"
                @change="getCityAcc"
                placeholder="请选择社保所在城市"
              >
                <a-select-option v-for="item in progNameList2" :key="item.areaId">{{ item.areaName }}</a-select-option>
              </a-select>
            </a-form-item>
            <div v-if="biaoji === '计划同步'" class="modal-box2" style="display: flex; justify-content: space-between">
              <div class="onwork">
                <div class="dataInfo2">
                  <div style="display: flex; justify-content: space-between; width: 100%">
                    <div style="display: flex; align-items: center">
                      <img src="@/assets/home/shuju1.png" style="width: 16px; height: 16px; margin-right: 10px" />
                      <div style="color: #55565d; font-size: 14px; font-weight: 700">社保数据同步</div>
                    </div>

                    <div
                      style="cursor: pointer; color: #6a66f6; font-size: 14px"
                      @click="getCityAcc(defaultFangan2)"
                      v-if="defaultFangan2 !== 0"
                    >
                      刷新
                    </div>
                  </div>
                </div>
                <div class="dataInfo2" style="margin-top: 15px">
                  <div style="color: #767885; font-size: 12px; margin-right: 12px">账号名称</div>
                  <a-tooltip
                    :style="[
                      { color: '#55565D' },
                      { fontSize: '12px' },
                      { width: '200px' },
                      { overflow: 'hidden' },
                      { whiteSpace: 'nowrap' },
                      { textOverflow: 'ellipsis' }
                    ]"
                  >
                    <template slot="title">
                      <span>{{ shebaoLogin.accountName }}</span>
                    </template>
                    {{ shebaoLogin.accountName }}
                  </a-tooltip>
                </div>
                <div class="dataInfo2" style="margin-top: 15px">
                  <div style="color: #767885; font-size: 12px">登录状态</div>
                  <div
                    :style="[
                      { color: shebaoLogin.isLogin ? '#6A66F6' : '#A6A8B4' },
                      { fontSize: '12px' },
                      { marginLeft: '12px' },
                      { cursor: !shebaoLogin.isLogin ? 'pointer' : '' },
                      { textDecoration: shebaoLogin.isLogin ? '' : 'underline' }
                    ]"
                    @click="Login(1)"
                  >
                    {{ shebaoLogin.isLogin ? "已登录" : "点击去登录" }}
                  </div>
                </div>
              </div>
            </div>
            <div
              v-if="biaoji === '计划同步'"
              style="
                background-color: #faf9f9;
                border-radius: 5px;
                padding-left: 15px;
                padding-top: 15px;
                padding-right: 15px;
                padding-bottom: 15px;
              "
            >
              <div sytle="font-size:14px;color:#55565D;font-weight:bold;">温馨提示</div>

              <div class="rowdalog2">
                <div style="font-size: 12px; color: #a6a8b4">1、同步数据需开启</div>
                <div class="edit" style="font-size: 12px; margin-left: 5px; cursor: pointer" @click="download">大数据助手</div>
                <div style="font-size: 12px; color: #a6a8b4">插件，并登录相应网站才可使用</div>
              </div>
              <div class="rowdalog2">
                <div style="font-size: 12px; color: #a6a8b4">2、导入人员名单需在花名册中，否则需先至花名册中新建。</div>
                <div class="edit" style="font-size: 12px; margin-left: 5px; cursor: pointer" @click="huamingce">立即前往</div>
              </div>
            </div>
          </a-form>
        </div>
      </a-modal>

      <a-modal
        :title="typeValueTime === 1 ? '查看计划' : '查看原因'"
        :visible="confirmPlanZengVisible"
        width="800px"
        @cancel="handleCancel"
        @ok="confirmPlanOkHandel"
      >
        <template slot="footer">
          <a-button type="primary" @click="confirmPlanOkHandel"> 确定 </a-button>
        </template>

        <div class="rowdialog">
          <img v-if="typeValueTime === 1" style="width: 28px; height: 28px" src="@/assets/img/overviewContract/icon4.png" />
          <img v-if="typeValueTime === 2" style="width: 28px; height: 28px" src="@/assets/icons/失败.png" />
          <div style="color: #3c3d43; font-size: 16px; margin-left: 10px">
            {{ currentItem ? getPostType(currentItem.empSocState) : "" }}计划执行{{ typeValueTime === 1 ? "成功" : "失败" }}
          </div>
        </div>
        <a-table
          style="margin-top: 20px"
          :columns="columnDialogDetail"
          :pagination="pagination2"
          :data-source="dataDetail3"
          :scroll="{ x: 700 }"
          colspan="0"
          row-key="id"
          @change="handlePageChange2"
        >
          <template slot="socOrStopSocDate" slot-scope="text, record">
            <span>{{ formatDate3(record.socOrStopSocDate) }}</span>
          </template>
          <template slot="serviceCost" slot-scope="text, record">
            <span>{{ record.serviceCost !== null ? record.serviceCost : "-" }}</span>
          </template>
          <template slot="empSocState" slot-scope="text">
            <div style="display: flex; flex-flow: column">
              <div>{{ getPostType(text) }}</div>
            </div>
          </template>
          <template slot="postType" slot-scope="text">
            <span>{{ $store.state.enums.postTypeArr[text - 1] }}</span>
          </template>
          <template slot="schemeName" slot-scope="text, record">
            <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
          </template>

          <template slot="socCityName" slot-scope="text, record">
            <a-tooltip placement="top">
              <template slot="title">
                <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
              </template>
              <span>{{ record.empSocState === 4 || record.empSocState === 5 ? "-" : text }}</span>
            </a-tooltip>
          </template>
        </a-table>
        <div v-if="fankuiDetail && fankuiDetail.length > 0" class="mt16 pt12" style="border-top: 1px solid #e8e8e8">
          <div class="fs16 fw500">反馈详情</div>
          <div style="max-height: 500px; overflow-y: auto">
            <div v-for="item in fankuiDetail" :key="item.id" class="pb12" style="border-bottom: 1px solid #e8e8e8">
              <div class="flex-center mt8" style="color: #919191">
                <div style="width: 100px">反馈人</div>
                <div>{{ item.userName }}</div>
              </div>
              <div class="flex-center mt8" style="color: #919191">
                <div style="width: 100px">反馈状态</div>
                <div>{{ item.feedbackState }}</div>
              </div>
              <div class="flex-center mt8" style="color: #919191">
                <div style="width: 100px">反馈时间</div>
                <div>{{ getDate(new Date(item.gmtCreate), true) }}</div>
              </div>
              <div class="flex-center mt8" style="color: #919191">
                <div style="width: 100px">反馈内容</div>
                <div>{{ item.feedbackContent }}</div>
              </div>
              <div class="flex mt8" style="color: #919191">
                <div style="width: 100px">附件</div>
                <div>
                  <UploadGeneralInline
                    v-model="item.annex"
                    :limit="10"
                    accept=".doc, .docx, .xls, .xlsx, .pdf, .zip, .rar, .jpg, .jpeg, .png"
                    :disabled="true"
                  >
                    <div slot="list" slot-scope="{ list }">
                      <PreviewItem v-for="li in list" :key="'' + li.uid" :url="li.url" :size="128" style="width: 238px" />
                    </div>
                  </UploadGeneralInline>
                </div>
              </div>
            </div>
          </div>
        </div>
      </a-modal>
      <a-modal :width="800" title="补充员工信息" :visible="buchongInfo" @cancel="handleCancel">
        <template slot="footer">
          <div style="display: flex; justify-content: center">
            <div>
              <a-button @click="handleCancel"> 取消同步 </a-button>
              <a-button type="primary" :disabled="getSynState() || spinning" @click="TongBuStart">
                {{ spinning ? "数据同步中" : "开始同步" }}
              </a-button>
            </div>
          </div>
        </template>
        <!-- tabs切换 -->
        <a-spin :spinning="spinning">
          <div class="employee-selector-wrapper2">
            <div>
              <div class="headerTitle">
                <div class="block" />
                <div class="title-info">人员列表({{ treeData.length }})</div>
              </div>
              <div class="employee-selector">
                <div v-for="(item, index) in treeData" :key="index">
                  <div
                    :style="[
                      { width: '100%' },
                      { height: '50px' },
                      { display: 'flex' },
                      { alignItems: 'center' },
                      {
                        backgroundColor: item.selected && item.selected === true ? '#6A66F622' : '#fff'
                      },
                      { cursor: 'pointer' }
                    ]"
                    @click="chose(item)"
                  >
                    <img src="@/assets/icons/person1.png" style="width: 30px; height: 30px; margin-right: 10px; margin-left: 10px" />
                    <div style="display: flex; flex-flow: column">
                      <span style="font-weight: 700">{{ item.xm }}</span>
                      <div style="display: flex; flex-flow: row; align-items: center">
                        <img
                          v-if="!item.skip && (item.errorInfo || item.errorInfo2)"
                          style="width: 13px; height: 13px; margin-right: 3px"
                          src="@/assets/icons/失败.png"
                        />
                        <img v-if="item.skip" style="width: 13px; height: 13px; margin-right: 3px" src="@/assets/icons/重复.png" />
                        <a-tooltip placement="topLeft">
                          <template slot="title">
                            <span>{{ item.errorInfo ? item.errorInfo : item.errorInfo2 ? item.errorInfo2 : "" }}</span>
                          </template>
                          <span style="margin-right: 10px; font-size: 12px">
                            {{
                              item.skip
                                ? "员工已跳过同步"
                                : item.errorInfo
                                ? ellipsis(item.errorInfo)
                                : item.errorInfo2
                                ? ellipsis(item.errorInfo2)
                                : ""
                            }}
                          </span>
                        </a-tooltip>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
            <div class="verticalBar" />
            <div class="employee-selector-block2" v-if="BCItem !== null">
              <div
                :style="[
                  { width: '100%' },
                  { marginBottom: '10px' },
                  { height: '70px' },
                  { display: 'flex' },
                  { alignItems: 'center' },
                  {
                    backgroundColor: '#6A66F622'
                  },
                  { cursor: 'pointer' }
                ]"
              >
                <img src="@/assets/icons/person1.png" style="width: 40px; height: 40px; margin-right: 10px; margin-left: 10px" />
                <div style="display: flex; flex-flow: column; width: 100%">
                  <span style="font-weight: 700">{{ BCItem ? BCItem.xm : "" }}</span>
                  <span style="margin-right: 10px"> 身份证号：{{ BCItem && BCItem.sfzhm ? BCItem.sfzhm : "" }} </span>
                </div>
                <a-button type="primary" ghost style="margin-right: 15px" @click="skipItem">
                  {{ BCItem.skip ? "取消跳过" : "跳过此人" }}
                </a-button>
              </div>
              <div style="height: 550px; overflow-y: auto" id="scrId">
                <div class="headerTitle" style="margin-top: 5px">
                  <div class="block" />
                  <div class="title-info">社保信息</div>
                </div>

                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">月工资</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">本单位开始缴费年月</span>
                  </a-col>
                </a-row>
                <a-row>
                  <a-col :span="13">
                    <a-input-number v-model="BCItem.extraInfo.wages" :min="0" style="width: 200px" />
                  </a-col>

                  <a-col :span="8">
                    <a-month-picker v-model="BCItem.extraInfo.currentInsuredStartDate" style="width: 200px" />
                  </a-col>
                </a-row>
                <div class="headerTitle" style="margin-top: 20px">
                  <div class="block" />
                  <div class="title-info">就业登记信息</div>
                </div>
                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">是否参与就业登记</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">就业单位</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-select
                      v-model="BCItem.extraInfo.employmentPermit"
                      placeholder="请选择"
                      style="width: 200px"
                      @change="handleJiuYeChange"
                    >
                      <a-select-option v-for="item in jiuyedengjiList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>

                  <a-col :span="8">
                    <a-select
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                      v-model="BCItem.extraInfo.employmentCompanyNum"
                      placeholder="请选择"
                      style="width: 200px"
                    >
                      <a-select-option v-for="item in danweiList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>
                </a-row>

                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">工种</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">劳动合同类型</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-select
                      show-search
                      :show-arrow="false"
                      placeholder="请输入进行搜索"
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                      option-filter-prop="children"
                      :default-active-first-option="false"
                      :filter-option="false"
                      style="width: 200px"
                      v-model="BCItem.extraInfo.jobsName"
                      @search="searchData"
                      @change="handlePersonnel"
                    >
                      <a-select-option v-for="item in searchPersonnelList" :key="item.id" :value="item.value">{{
                        item.value
                      }}</a-select-option>
                      <div slot="dropdownRender" slot-scope="menu">
                        <v-nodes :vnodes="menu" />
                        <a-divider style="margin: 4px 0" />
                        <div
                          style="
                            width: 100%;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            cursor: pointer;
                            margin-bottom: 6px;
                          "
                          @mousedown="(e) => e.preventDefault()"
                          @click="reSearch"
                        >
                          加载更多
                        </div>
                      </div>
                    </a-select>
                  </a-col>

                  <a-col :span="8">
                    <a-select
                      v-model="BCItem.extraInfo.laborContractsType"
                      placeholder="请选择"
                      style="width: 200px"
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                    >
                      <a-select-option v-for="item in hetongleixingList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">合同签订日期</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">合同开始日期</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-date-picker
                      v-model="BCItem.extraInfo.contractsSignedDate"
                      style="width: 200px"
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                    />
                  </a-col>

                  <a-col :span="8">
                    <a-date-picker
                      v-model="BCItem.extraInfo.contractsStartDate"
                      style="width: 200px"
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                    />
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">合同终止日期</span>
                  </a-col>

                  <a-col :span="10">
                    <span style="width: 100%">灵活性就业人员是否参加医保</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-date-picker
                      v-model="BCItem.extraInfo.contractsEndDate"
                      style="width: 200px"
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                    />
                  </a-col>

                  <a-col :span="8">
                    <a-select
                      v-model="BCItem.extraInfo.whetherMe"
                      placeholder="请选择"
                      style="width: 200px"
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                    >
                      <a-select-option v-for="item in shifouyibaoList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">就业人员类别</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%"></span>
                  </a-col>
                </a-row>
                <a-row>
                  <a-col :span="13">
                    <a-select
                      v-model="BCItem.extraInfo.employmentType"
                      placeholder="请选择"
                      style="width: 200px"
                      :disabled="BCItem.extraInfo.employmentPermit === 0"
                    >
                      <a-select-option v-for="item in jiuyeleibieList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>

                  <a-col :span="8"> </a-col>
                </a-row>
                <div class="headerTitle" style="margin-top: 20px">
                  <div class="block" />
                  <div class="title-info">个人基本信息</div>
                </div>
                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">身份证件类型</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">民族</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-select v-model="BCItem.yxzjlx" placeholder="请选择" style="width: 200px">
                      <a-select-option v-for="item in zhengjianleixingList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>

                  <a-col :span="8">
                    <a-select v-model="BCItem.mz" placeholder="请选择" style="width: 200px">
                      <a-select-option v-for="item in minzuList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>
                </a-row>

                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">省(户籍行政区)</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">市(户籍行政区)</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-select v-model="BCItem.province" placeholder="请选择" style="width: 200px" @change="handleShengChange">
                      <a-select-option v-for="item in shengList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>

                  <a-col :span="8">
                    <a-select v-model="BCItem.city" placeholder="请选择" style="width: 200px" @change="handleShiChange">
                      <a-select-option v-for="item in shiList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">户口所在地行政区划</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">户口性质</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-select v-model="BCItem.hkszdxzqh" placeholder="请选择" style="width: 200px">
                      <a-select-option v-for="item in quList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>

                  <a-col :span="8">
                    <a-select v-model="BCItem.hkxz" placeholder="请选择" style="width: 200px">
                      <a-select-option v-for="item in xingzhiList" :key="item.id">{{ item.value }}</a-select-option>
                    </a-select>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 5px">
                  <a-col :span="13">
                    <span style="width: 100%">户口所在地</span>
                  </a-col>

                  <a-col :span="8">
                    <span style="width: 100%">通讯地址</span>
                  </a-col>
                </a-row>
                <a-row style="margin-bottom: 20px">
                  <a-col :span="13">
                    <a-input v-model="BCItem.addressHousehold" style="width: 200px" />
                  </a-col>

                  <a-col :span="8">
                    <a-input v-model="BCItem.txdz" style="width: 200px" />
                  </a-col>
                </a-row>
              </div>
            </div>
          </div>
        </a-spin>
      </a-modal>
      <a-modal title="同步结果" :visible="confirmPlanTongBu" width="800px" @cancel="handleCancel" @ok="handleCancel">
        <template slot="footer">
          <a-button type="primary" @click="handleCancel"> 确定 </a-button>
        </template>

        <div class="rowdialog">
          <div style="display: flex; flex-flow: column; width: 100%">
            <div style="display: flex; flex-flow: row; align-items: center">
              <img style="width: 22px; height: 22px" src="@/assets/img/overviewContract/icon4.png" />
              <div style="color: #3c3d43; font-size: 15px; margin-left: 5px; font-weight: 700">同步完成</div>
            </div>
            <div style="color: #767885; font-size: 13px; margin-left: 28px">
              同步结果：成功{{ sucNum }}人，失败{{ dataDetailJieG.length - sucNum }}人
            </div>
          </div>
        </div>
        <a-table
          style="margin-top: 20px"
          :columns="columnDialogTongbu"
          :pagination="pagination2"
          :data-source="dataDetailJieG"
          :scroll="{ x: 700 }"
          colspan="0"
          row-key="id"
          @change="handlePageChange2"
        >
          <template slot="result" slot-scope="text">
            <span>{{ text === "0" ? "失败" : "成功" }}</span>
          </template>
          <template slot="info" slot-scope="text, record">
            <a-tooltip placement="top">
              <template slot="title">
                <span>{{ record.info }}</span>
              </template>
              <span>{{ ellipsis(record.info) }}</span>
            </a-tooltip>
          </template>
        </a-table>
      </a-modal>
    </a-layout>
  </div>
</template>

<script>
import {
  getAmount,
  getListAllRelation,
  addEmpSocInfos,
  decEmpSocInfos,
  deleteEmpSocInfos,
  getJianYuanList,
  getTopZengJian,
  getTopZengJianList,
  remvoeZenyuanOk,
  remvoeJianyuanOk,
  updatajianyuan,
  updatazengyuan,
  increaseConfirm,
  decreaseConfirm,
  getEnum,
  getToken,
  getCityAcc,
  getCity,
  verAccToken,
  checkEmpQ,
  getEmpSocImport,
  incrementSocEmp,
  selectByDictCode,
  selectShiName,
  registrationUnit,
  getShebaoToken
} from "@/api/shebao/shebaoInfo.js";
import moment from "moment";
import { getDepartmentInTree } from "@/api/department/department";
import EmployeeSelect from "@/components/EmployeeSelect2/employeeSelect3";
import { AreaPicker as city } from "xqjr-plugin-common";
import { formatDate, isContainByString } from "@/utils/index";
import CountTo from "vue-count-to";
import { increaseOrDecreaseListHeadReq } from "./api";
import { buildColumnsDetail, columnDetail, columnDialogDetailJianYuan, columnDialogDetail, columnDialogTongbu } from "./funcs";
import { getDate } from "@/utils/tools";
import { mapState } from "vuex";
import UploadGeneralInline from "xqjr-plugin-common/FileHandler/UploadGeneralInline.vue";
import PreviewItem from "xqjr-plugin-form/components/previewItem.vue";
export default {
  components: {
    EmployeeSelect,
    city,
    CountTo,
    UploadGeneralInline,
    PreviewItem,
    VNodes: {
      functional: true,
      render: (h, ctx) => ctx.props.vnodes
    }
  },

  data() {
    return {
      fankuiDetail: [],
      annex: "",
      shebaopaidanAdmin: [],
      queryUserListLessToMeList: [],
      shebaopaidanVisible: false,
      xingzhiList: [],
      quList: [],
      shengList: [],
      shiList: [],
      sucNum: 0,
      minzuList: [],
      zhengjianleixingList: [],
      zhengjianleixingListYuan: [],
      jiuyeleibieList: [],
      shifouyibaoList: [
        { id: 0, value: "否" },
        { id: 1, value: "是" }
      ],

      gongzhongList2: [],
      hetongleixingList: [],
      jiuyedengjiList: [
        { id: 0, value: "否" },
        { id: 1, value: "是" }
      ],
      danweiList: [],
      BCItem: null,
      treeData: [],
      dataDetailJieG: [],
      buchongInfo: false,
      confirmPlanTongBu: false,
      shebaoAcc: "",
      shebaoPassW: "",
      spinning: false,
      shebaoLogin: {
        accountId: null,
        accountName: null,
        accountType: "社保",
        areaId: "282",
        areaName: null,
        cookie: null,
        extraField: null,
        isLogin: false
      },
      biaoji: "计划反馈",
      isContainByString,
      isConfirmPlan: false,
      confirmPlanZeng: true,
      confirmPlanZengVisible: false,
      editPlan: false,
      zengyuanOrJianyuan: true,
      isDaoru: false,
      topData: [
        {
          title: "全部计划数",
          num: 0,
          empIdList: [],
          url: require("@/assets/shebao/全部.png")
        },
        {
          title: "增员计划数",
          num: 0,
          empIdList: [],
          url: require("@/assets/shebao/停保.png")
        },
        {
          title: "减员计划数",
          num: 0,
          empIdList: [],
          url: require("@/assets/shebao/正常参保.png")
        },
        {
          title: "待增员计划数",
          num: 0,
          empIdList: [],
          url: require("@/assets/shebao/增员减员.png")
        },
        {
          title: "待减员计划数",
          num: 0,
          empIdList: [],
          url: require("@/assets/shebao/减员.png")
        }
      ],
      dateOpen: false,
      cutYear: "",
      cutMonth: "",
      depId: "",
      tempPlanId: "",
      tempEmpSocStatus: 0,
      empId: "",
      searchName: null,
      monthFormat: "YYYY-MM",
      removeZengVisible: false,
      empcompanyPfAmount: "",
      empcompanySocAmount: "",
      emppersonalPfAmount: "",
      emppersonalSocAmount: "",
      isUndoShebao: false,
      isShowShebaoInfo: false,
      Dvisible: false,
      Lvisible: false,
      isGongJJBase: true,
      progNameList: [],
      progNameList2: [],
      personTypeList: [], // 人员类型
      shebaoDetailList: [],
      isCloseMethod: false,
      isJCloseMethod: false,
      isSetting: false,
      columnDetail,
      columnDetailNoAction: [],
      searchVisible: false,
      columnDialogTongbu,
      columnDialogDetail,
      columnDialogDetailJianYuan,
      depInfoOptions: [],
      isChooseStaff: false,
      dataDetail: [],
      dataDetail2: [],
      dataDetail3: [],
      dataDetail4: [],
      dataStopDetail: [],
      socCityName: "",
      existName: [],
      defaultGongjiJin: 0,
      // existEmpId: [],
      pagination: {
        pageSize: 10,
        total: 0,
        size: "default",
        current: 1,
        showTotal: (total) => `共${total}条`,
        showQuickJumper: true,
        showSizeChanger: true,
        pageSizeOptions: ["10", "20", "50", "100"],
        onShowSizeChange: (current, pageSize) => {
          this.pagination.current = current;
          this.pagination.defaultCurrent = pageSize;
        }
      },
      pagination2: {
        pageSize: 10,
        total: 0,
        size: "default",
        current: 1,
        showTotal: (total) => `共${total}条`,
        showQuickJumper: true
        // showSizeChanger: true
      },
      defaultFangan: 0,
      defaultFangan2: 0,
      searchForm: {},
      isShebaoBase: true,
      feedbackFlag: "",
      typeValueTime: 1,
      progName: "",
      monthYear: "",
      id: "",
      year: "",
      month: "",
      progId: "", // 方案id
      progIdsear: "",
      type: "",
      staffList: [],
      formData: [],
      serviceCost: 0,
      selectedRowKeys: [],
      defaultCard: 0, // 社保设置全部的基数
      evName: "",
      evIdCard: "",
      tempDate: "",
      evDepName: "",
      evsocCityName: "",
      evprogName: "",
      evpfCard: "",
      socCard: "",
      progKeyId: "",
      keyId: "",
      empPhoto: "",
      socCity: "",
      stopyear: "",
      stopmonth: "",
      stopYByear: "",
      stopYBmonth: "",
      stopGjyear: "",
      JYserviceCost: undefined,
      stopGjmonth: "",
      feedbackContent: "",
      isChooseStaffLeave: false,
      empMonthList: [],
      jihuaZengJianYuan: 0,
      active: 0,
      jumpYear: "",
      jumpMonth: "",
      jumpId: "",
      payProvidentFund: false, // 是否缴纳公积金
      onlySocAmount: false, // 仅设置参保金额
      currentItem: null,
      addShebao: false,
      addYibao: false,
      addGjj: false,
      jianShebao: false,
      jianYibao: false,
      jianGjj: false,
      jianShebao_2: true,
      jianYibao_2: true,
      confirmLoading: false,
      jianGjj_2: true,
      socImport: null,
      pfImport: null,
      meImport: null,
      useSocImport: false,
      usePfImport: false,
      useMeImport: false,
      accModel: false,
      code: 0,
      searchPersonnelList: [],
      searchDataValue: undefined,
      searIndex: 0
    };
  },
  computed: {
    ...mapState(["site"]),
    selectedRows() {
      return this.dataDetail.filter((item, idx) => this.selectedRowKeys.includes(idx));
    }
  },
  watch: {
    annex(newVal) {
      console.log(newVal);
    }
  },
  created() {
    this.$request({ url: `/hr/api/v1/users/selectHadRoleUserIdBySiteId` })
      .then((res) => {
        this.queryUserListLessToMeList = res.data.map((item) => ({
          value: item.id,
          label: item.name
        }));
      })
      .catch((err) => {
        console.log("queryUserListLessToMe", err);
      });
    getDepartmentInTree({ companyId: this.$store.state.hr.companyId }).then((res) => {
      this.depInfoOptions = this.tree1(res.data, "depChildList", false);
    });

    if (this.$route.query.searchName) {
      // 消息推送进来
      this.searchName = this.$route.query.searchName;
    }
    if (this.$route.query.id) {
      this.id = this.$route.query.id;
      this.year = this.$route.query.year;
      this.month = this.$route.query.month;
    } else {
      const nowDate = new Date();
      this.year = "" + nowDate.getFullYear();
      this.month = nowDate.getMonth() + 1;
      if (this.month < 10) {
        this.month = "0" + this.month;
      }

      this.stopyear = "" + nowDate.getFullYear();
      this.stopmonth = this.month;
      this.stopYByear = "" + nowDate.getFullYear();
      this.stopYBmonth = this.month;
      this.stopGjyear = "" + nowDate.getFullYear();
      this.stopGjmonth = this.month;
    }
    this.active = this.$route.query.index || 0;
    this.checkPeopleAmount();
    this.checkShebaoMethod();
    this.getEnum();
    this.getTopZengJian(); // 增减员顶部统计
    this.defaultFangan = 0;

    this.spinning = false;
    getCity({ isDistinct: true })
      .then((res) => {
        if (res.data !== null) {
          if (res.data !== null) {
            this.progNameList2 = [];
            for (var i = 0; i < res.data.length; i++) {
              if (res.data[i].areaName === "青岛") {
                this.progNameList2.push(res.data[i]);
              }
            }
          }
        }
      })
      .catch((err) => {
        this.$message.error("失败!");
        console.log("debug log --> ", err);
      });

    selectByDictCode({ dictCode: 1207 }).then((res) => {
      res.data.map((item) => {
        var i = {
          id: item.dictItemKey,
          value: item.dictItemValue
        };
        this.hetongleixingList.push(i);
      });
    });
    selectByDictCode({ dictCode: 1208 }).then((res) => {
      res.data.map((item) => {
        var i = {
          id: item.dictItemKey,
          value: item.dictItemValue
        };
        this.jiuyeleibieList.push(i);
      });
    });
    selectByDictCode({ dictCode: 1206 }).then((res) => {
      res.data.map((item) => {
        var i = {
          id: item.dictItemKey,
          value: item.dictItemValue
        };
        this.shengList.push(i);
      });
    });
    selectByDictCode({ dictCode: 1210 }).then((res) => {
      res.data.map((item) => {
        var i = {
          id: item.dictItemKey,
          value: item.dictItemValue
        };
        this.xingzhiList.push(i);
      });
    });
    selectByDictCode({ dictCode: 1211 }).then((res) => {
      res.data.map((item) => {
        var i = {
          id: item.dictItemKey,
          value: item.dictItemValue
        };
        this.minzuList.push(i);
      });
    });
    selectByDictCode({ dictCode: 1212 }).then((res) => {
      this.zhengjianleixingListYuan = res.data;
      res.data.map((item) => {
        var i = {
          id: item.dictItemValue,
          value: item.dictItemValue
        };
        this.zhengjianleixingList.push(i);
      });
    });
    this.gongzhongList2 = [];
    selectByDictCode({ dictCode: 1205 }).then((res) => {
      res.data.map((item) => {
        var i = {
          id: item.dictItemKey,
          value: item.dictItemValue
        };
        this.gongzhongList2.push(i);
      });
    });
    var that = this;
    document.addEventListener("SynCode", function (e) {
      that.code = e.detail.code;
    });
  },

  methods: {
    getDate,
    removeSelected(record) {
      const idx = this.dataDetail.findIndex((item) => item.id === record.id);
      if (idx > -1) {
        const idxKey = this.selectedRowKeys.findIndex((li) => li === idx);
        if (idxKey > -1) {
          const temp = [...this.selectedRowKeys];
          temp.splice(idxKey, 1);
          this.selectedRowKeys = temp;
        }
      }
    },
    onShebaopaidanOk() {
      if (this.shebaopaidanAdmin && this.shebaopaidanAdmin.length > 0) {
        if (this.selectedRows && this.selectedRows.length > 0) {
          this.$request({
            url: `/hr/api/v1/socPlanDispatchUsers/dispatch`,
            method: "post",
            data: {
              planIdList: this.selectedRows.map((item) => item.id),
              userIdList: this.shebaopaidanAdmin
            }
          })
            .then((res) => {
              this.$message.success("派单成功");
              this.shebaopaidanVisible = false;
              this.shebaopaidanAdmin = [];
            })
            .catch((err) => {
              console.log(err);
            });
        } else {
          this.$message.warning("请选择社保单");
        }
      } else {
        this.$message.warning("请选择接单人员");
      }
    },
    shebaopaidan() {
      if (this.selectedRowKeys.length === 0) {
        this.$message.success("请勾选要派单的人员");
        return;
      }
      this.shebaopaidanVisible = true;
    },
    searchData(value) {
      this.searchDataValue = value;
      this.searIndex = 0;
      this.searchPersonnel();
    },
    reSearch() {
      if (this.searchDataValue) {
        this.searIndex += 1;
        this.searchPersonnel(this.searchDataValue);
      } else {
        this.$message.error("请输入工种进行搜索");
      }
    },
    async handlePersonnel(id) {
      this.searIndex = 0;
      const obj = this.searchPersonnelList.find((item) => {
        return item.value === id;
      });
      this.BCItem.extraInfo.jobs = obj.id;
      this.searchDataValue = undefined;
    },
    async searchPersonnel() {
      if (this.searIndex === 0) {
        this.searchPersonnelList = [];
      }
      var index = 0;
      while (this.searIndex < this.gongzhongList2.length) {
        if (this.gongzhongList2[this.searIndex].value.indexOf(this.searchDataValue) !== -1) {
          index += 1;
          this.searchPersonnelList.push(this.gongzhongList2[this.searIndex]);
          if (index === 15) {
            break;
          }
        }
        this.searIndex += 1;
      }
    },
    filterOption(input, option) {
      if (option.componentOptions.children[0]) {
        return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0;
      } else {
        console.log(option);
        return false;
      }
    },

    checkList() {
      for (var i = 0; i < this.dataDetail3.length; i++) {
        if ((this.dataDetail3[i].empSocState !== 2 && this.dataDetail3[i].empSocState !== 3) || this.dataDetail3[i].type !== 1) {
          return true;
        }
      }
      return false;
    },
    skipItem() {
      this.BCItem.skip = !this.BCItem.skip;
    },
    handleJiuYeChange(id) {
      if (id === 0) {
        this.BCItem.extraInfo = {
          employmentCompanyNum: "", // 就业单位编号
          contractsEndDate: "", // 合同终止日期//////////////////000000000
          contractsSignedDate: "", // 合同签订日期///////////////0000000000
          contractsStartDate: "", // 合同开始日期/////////////////000000000
          currentInsuredStartDate: this.BCItem.extraInfo.currentInsuredStartDate, // 本次参保开始年月/////////////////000000000000
          employmentPermit: 0, // 是否参加就业登记/////////////////////0000000000000
          employmentType: "", // 就业人员类别///////////////////00000000
          jobs: "", // 工种//////////////////////////////////////00000000000000
          laborContractsType: "", // 劳动合同类型///////////////////000000000000
          wages: this.BCItem.extraInfo.wages, // 工资/////////////////////////////////////000000000000000
          whetherMe: 0 // 灵活性就业人员是否参加医疗保险///////////////00000000000000
        };
      }
    },
    handleShiChange(shiId) {
      this.quList = [];
      selectShiName({ dictCode: 1206, parentId: shiId }).then((res) => {
        res.data.map((item) => {
          var i = {
            id: item.dictItemKey,
            value: item.dictItemValue
          };
          this.quList.push(i);
        });
      });
    },
    handleShengChange(shengId) {
      this.shiList = [];
      selectShiName({ dictCode: 1206, parentId: shengId }).then((res) => {
        res.data.map((item) => {
          var i = {
            id: item.dictItemKey,
            value: item.dictItemValue
          };
          this.shiList.push(i);
        });
      });
    },
    ellipsis(value) {
      if (!value) return "";
      if (value.length > 10) {
        return value.slice(0, 12) + "...";
      }
      return value;
    },
    getSynState() {
      if (this.treeData.length !== 0) {
        const dataskip = this.treeData.filter((item) => item.skip === false);
        if (dataskip.length !== 0) {
          const data = dataskip.filter((item) => !item.errorInfo && !item.errorInfo2);

          if (data.length === 0) {
            return true;
          }
        }
      }
      return false;
    },
    checkPersonInfo(item) {
      if (!item.errorInfo) {
        if (
          item.hkszdxzqh.length === 0 ||
          item.hkxz.length === 0 ||
          item.mz.length === 0 ||
          item.province.length === 0 ||
          item.txdz.length === 0 ||
          item.yxzjlx.length === 0 ||
          item.addressHousehold.length === 0 ||
          item.city.length === 0
        ) {
          item.errorInfo2 = "员工信息缺失";
        } else if (item.extraInfo.employmentPermit !== 0) {
          if (
            item.extraInfo.employmentCompanyNum.length === 0 ||
            item.extraInfo.contractsEndDate.length === 0 ||
            item.extraInfo.contractsSignedDate.length === 0 ||
            item.extraInfo.contractsStartDate.length === 0 ||
            item.extraInfo.currentInsuredStartDate.length === 0 ||
            item.extraInfo.employmentPermit.length === 0 ||
            item.extraInfo.employmentType.length === 0 ||
            item.extraInfo.jobs.length === 0 ||
            item.extraInfo.wages.length === 0 ||
            item.extraInfo.whetherMe.length === 0
          ) {
            item.errorInfo2 = "员工信息缺失";
          } else {
            item.errorInfo2 = null;
          }
        } else {
          item.errorInfo2 = null;
        }
      }
    },
    TongBuStart() {
      this.spinning = true;
      let isErro = "";
      for (var i = 0; i < this.treeData.length; i++) {
        if (this.treeData[i].skip) {
          continue;
        }
        this.checkPersonInfo(this.treeData[i]);
        if (this.treeData[i].errorInfo) {
          isErro = this.treeData[i].xm + "无法进行同步,请跳过此人";
        } else if (this.treeData[i].errorInfo2) {
          isErro = "请将" + this.treeData[i].xm + "的内容填写完整！";
          break;
        }
      }

      if (isErro !== "") {
        this.spinning = false;
        this.$message.error(isErro);
        return;
      }
      const data = this.treeData.filter((item) => item.skip === false);
      // const data = dataskip.filter((item) => !item.errorInfo);

      if (data.length === 0) {
        this.spinning = false;
        this.$message.error("没有符合同步条件的数据");
        return;
      }

      for (var j = 0; j < data.length; j++) {
        this.zhengjianleixingListYuan.map((item) => {
          if (item.dictItemValue === data[j].yxzjlx) {
            data[j].yxzjlx = item.dictItemKey;
          }
        });

        data[j].extraInfo.companyNum = this.code;
        if (data[j].extraInfo.currentInsuredStartDate !== "") {
          data[j].extraInfo.currentInsuredStartDate = moment(data[j].extraInfo.currentInsuredStartDate).format("YYYYMM");
        }
        if (data[j].extraInfo.contractsSignedDate !== "") {
          data[j].extraInfo.contractsSignedDate = moment(data[j].extraInfo.contractsSignedDate).format("YYYYMMDD");
        }
        if (data[j].extraInfo.contractsStartDate !== "") {
          data[j].extraInfo.contractsStartDate = moment(data[j].extraInfo.contractsStartDate).format("YYYYMMDD");
        }
        if (data[j].extraInfo.contractsEndDate !== "") {
          data[j].extraInfo.contractsEndDate = moment(data[j].extraInfo.contractsEndDate).format("YYYYMMDD");
        }
      }

      let syncName;
      this.progNameList2.map((item) => {
        if (item.areaId === this.defaultFangan2) {
          syncName = item.syncServiceBeanName;
        }
      });

      var dd = {
        areaId: this.defaultFangan2,
        companyId: this.$store.state.hr.companyId,
        syncServiceBeanName: syncName,

        extraInfo: [...data]
      };

      this.dataDetailJieG = [];
      incrementSocEmp(dd)
        .then((res) => {
          this.spinning = false;
          this.buchongInfo = false;
          this.confirmPlanTongBu = true;

          this.selectedRowKeys = [];
          this.checkPeopleAmount();
          this.getTopZengJian();

          res.data.map((item) => {
            this.dataDetailJieG.push({
              name: item.name,
              type: item.syncType,
              result: item.respCode,
              info: item.respMsg
            });
            if (item.respCode !== "0") {
              this.sucNum += 1;
            }
          });
          this.x;
        })
        .catch((err) => {
          this.spinning = false;
          this.$message.error("失败!");
          console.log("debug log --> ", err);
        });
    },
    chose(item) {
      this.BCItem = item;
      this.initShengshiqu(this.BCItem);
    },
    confirmAccHandel() {
      if (this.shebaoAcc.length === 0) {
        this.$message.error("请填写账号");
        return;
      }
      if (this.shebaoPassW.length === 0) {
        this.$message.error("请填写密码");
        return;
      }
      // this.SyncHandle();
      verAccToken({ companyId: this.$store.state.hr.companyId, userName: this.shebaoAcc, password: this.shebaoPassW })
        .then((res) => {
          this.SyncHandle();
        })
        .catch((err) => {
          this.$message.error("失败!");
          console.log("debug log --> ", err);
        });
    },
    SyncHandle() {
      this.spinning = true;

      const ids = [];
      this.dataDetail3.map((item) => {
        ids.push(item.id);
      });
      checkEmpQ({
        planIdList: ids
      })
        .then((res) => {
          this.accModel = false;
          this.spinning = false;

          this.treeData = [];
          var networkErr = false;
          for (var i = 0; i < res.data.length; i++) {
            if (res.data[i].errorInfo && res.data[i].errorInfo.indexOf("302") !== -1) {
              networkErr = true;
              break;
            }
            var item = {
              hkszdxzqh: res.data[i].hkszdxzqh, // 户口所在地行政区划----------///////000000000
              hkxz: res.data[i].hkxz, // 户口性质---------//////000000
              mz: res.data[i].mz, // 民族------------//////////000000000000
              province: res.data[i].province, // 省级代码-----------///////00000000
              txdz: res.data[i].txdz, // 通讯地址-----------//////000000000
              yxzjlx: res.data[i].yxzjlx, // 有效证件类型------------\\\\\\\\\000000000
              addressHousehold: res.data[i].addressHousehold, // 户籍地址--------///////000000000
              city: res.data[i].city, // 市级代码--------/////000000000000
              planId: res.data[i].planId,
              errorInfo: res.data[i].errorInfo,
              errorInfo2: null,
              empId: res.data[i].empId,
              skip: false,
              // 先使用
              xm: res.data[i].xm,
              sfzhm: res.data[i].sfzhm
            };
            item.extraInfo = {
              employmentCompanyNum: "", // 就业单位编号
              contractsEndDate: "", // 合同终止日期//////////////////000000000
              contractsSignedDate: "", // 合同签订日期///////////////0000000000
              contractsStartDate: "", // 合同开始日期/////////////////000000000
              currentInsuredStartDate: "", // 本次参保开始年月/////////////////000000000000
              employmentPermit: 0, // 是否参加就业登记/////////////////////0000000000000
              employmentType: "", // 就业人员类别///////////////////00000000
              jobs: "", // 工种//////////////////////////////////////00000000000000
              laborContractsType: "", // 劳动合同类型///////////////////000000000000
              wages: "", // 工资/////////////////////////////////////000000000000000
              whetherMe: 0 // 灵活性就业人员是否参加医疗保险///////////////00000000000000
            };
            this.treeData.push(item);
          }

          if (this.treeData.length !== 0) {
            // 默认选择第一个
            this.treeData[0].selected = true;
            this.BCItem = this.treeData[0];
            this.initShengshiqu(this.BCItem);
          }
          if (networkErr) {
            this.$message.error("社保网站异常，请稍后重试！");
          } else {
            this.isConfirmPlan = false;
            this.buchongInfo = true;
            this.$nextTick(() => {
              document.getElementById("scrId").scrollTop = 0;
            });
          }
        })
        .catch((err) => {
          this.spinning = false;
          console.log("debug log --> ", err);
        });
    },
    initShengshiqu(item) {
      for (var i = 0; i < this.treeData.length; i++) {
        if (this.treeData[i].selected && this.treeData[i].selected === true) {
          this.checkPersonInfo(this.treeData[i]);
        }
        this.treeData[i].selected = false;
      }
      item.selected = true;
      console.log("xxxxxxxxxxx===" + item.selected);

      if (item.province !== "" && item.province !== null) {
        // 省级字段有值
        // 请求市列表
        this.shiList = [];
        selectShiName({ dictCode: 1206, parentId: item.province }).then((res) => {
          res.data.map((item) => {
            var i = {
              id: item.dictItemKey,
              value: item.dictItemValue
            };
            this.shiList.push(i);
          });
        });
      }
      if (item.city !== "" && item.city !== null) {
        this.quList = [];
        selectShiName({ dictCode: 1206, parentId: item.city }).then((res) => {
          res.data.map((item) => {
            var i = {
              id: item.dictItemKey,
              value: item.dictItemValue
            };
            this.quList.push(i);
          });
        });
      }
    },
    Login(index) {
      if (!this.shebaoLogin.loginUrl) {
        this.$message.success("请选择社保所在城市");
        return;
      }
      switch (index) {
        case 1: // 社保
          if (this.shebaoLogin.loginUrl !== null && this.shebaoLogin.loginUrl.length !== 0) {
            window.open(this.shebaoLogin.loginUrl);
          }

          break;
      }
    },
    download() {
      window.open("https://www.yuque.com/docs/share/aadc62e4-0ea4-4387-80f3-ad8cd724018f?#");
    },
    huamingce() {
      this.$router.push({
        path: "/shebao/employee"
      });
    },
    handleSizeChange(e) {
      this.biaoji = e.target.value;
    },
    addFangan() {
      this.isCloseMethod = false;
      this.$router.push({
        path: `/${this.isContainByString("contractAdmin") ? "contractAdmin" : "shebao"}/shebaoMethod/addMethod`
      });
    },
    hasYibao(fromdate) {
      for (var i = 0, len = fromdate.length; i < len; i++) {
        if (fromdate[i].itemType === 3) {
          return true;
        }
      }
      return false;
    },
    hasShebao(fromdate) {
      for (var i = 0, len = fromdate.length; i < len; i++) {
        if (fromdate[i].itemType === 1) {
          return true;
        }
      }
      return false;
    },
    handleCancel2() {
      this.searchVisible = false;
    },
    handleFormSearch() {
      this.searchVisible = false;
      this.checkPeopleAmount();
    },
    getProgNameList() {
      if (this.editPlan) {
        var newProgList = [];
        for (var i = 0; i < this.progNameList.length; i++) {
          for (var j = 0; j < this.progNameList[i].socProgItemVOList.length; j++) {
            if (this.progNameList[i].socProgItemVOList[j].itemType === this.currentItem.type) {
              newProgList.push(this.progNameList[i]);
              break;
            }
          }
        }
        return newProgList;
      } else {
        return this.progNameList;
      }
    },
    async loadFabkuiDetail(planId) {
      await this.$request({
        url: `/hr/api/v1/socPlanFeedbackRecords/selectRecordByPlanId/${planId}`,
        method: "get"
      })
        .then((res) => {
          this.fankuiDetail = res.data;
        })
        .catch((err) => {
          console.log("selectRecordByPlanId", err);
        });
    },
    async lookReason(text1) {
      this.typeValueTime = 2;
      this.currentItem = text1;
      this.dataDetail3 = [];
      this.dataDetail3.push(text1);
      await this.loadFabkuiDetail(text1.id);
      this.confirmPlanZengVisible = true;
      this.feedbackContent = text1.feedbackContent;
      this.annex = text1.annex;
    },
    async lookPlan(text1) {
      this.currentItem = text1;
      this.typeValueTime = 1;
      this.dataDetail3 = [];
      this.dataDetail3.push(text1);
      await this.loadFabkuiDetail(text1.id);
      this.confirmPlanZengVisible = true;
      this.feedbackContent = text1.feedbackContent;
      this.annex = text1.annex;
    },
    getItemType(index) {
      for (var i = 0; i < this.formData.length; i++) {
        if (this.formData[i].itemType === index) {
          return true;
        }
      }
      return false;
    },
    getDefaultValue() {
      return moment(this.year + "-" + this.month, this.monthFormat);
    },
    onTypeChange1(e) {
      this.addShebao = e.target.checked;
    },
    onTypeChange2(e) {
      this.addYibao = e.target.checked;
    },
    onTypeChange3(e) {
      this.addGjj = e.target.checked;
    },
    onTypejianChange1(e) {
      this.jianShebao = e.target.checked;
    },
    onTypejianChange2(e) {
      this.jianYibao = e.target.checked;
    },
    onTypejianChange3(e) {
      this.jianGjj = e.target.checked;
    },
    onTopTabs(index) {
      this.active = index;
      this.pagination.current = 1;
      this.checkPeopleAmount();
    },

    disabledDate(current) {
      // 只能选择当月往后的月份
      return current && current < moment().startOf("month"); // 月份第一天
    },
    disabledDate2(current) {
      // 只能选择当月
      return current && (current < moment().startOf("month") || current > moment().endOf("month")); // 月份第一天
    },
    canbaoguanli() {
      if (this.jumpId.length !== 0 && this.jumpMonth.length !== 0 && this.jumpYear.length !== 0) {
        this.$router.push({
          path: "/shebao/shebaoManage/shebaoDetail",
          query: {
            id: this.jumpId,
            month: this.jumpMonth,
            year: this.jumpYear
          }
        });
      } else {
        this.goback();
      }
    },
    handleProgTime(date, dateString) {
      this.jihuaZengJianYuan = Number(date);
      this.pagination.current = 1;
    },
    // 完成对话框社保编辑
    finishEdit() {
      if ((this.defaultGongjiJin + "").trim() === "") {
        this.$message.success("公积金基数不能为空");
        return;
      }
      if ((this.defaultCard + "").trim() === "") {
        this.$message.success("个人社保基数不能为空");
        return;
      }

      var that = this;
      if (!this.editPlan) {
        if (this.zengyuanOrJianyuan) {
          if (!this.addShebao && !this.addGjj && !this.addYibao) {
            this.$message.success("请选择增员项目");
            return;
          }
        } else {
          if (!this.jianShebao && !this.jianGjj && !this.jianYibao) {
            this.$message.success("请选择减员项目");
            return;
          }
        }

        if (this.defaultFangan === 0) {
          that.$message.success("请先创建参保方案");
          return;
        } else {
          // 弹出添加增减员下一步对话框
          this.Dvisible = true;
        }
      } else {
        // 增减员编辑请求
        if (this.isCloseMethod) {
          // 编辑增员

          if (this.progId || this.progId === "") {
            updatazengyuan({
              companyId: this.$store.state.hr.companyId,
              empSocPlanUpdateDTO: {
                type: this.currentItem.type,
                year: this.year,
                month: this.month,
                itemUpdateList: this.formData,
                schemeId: this.defaultFangan,
                empId: this.empId,
                id: this.tempPlanId,
                serviceCost: this.serviceCost
              }
            }).then((res) => {
              this.progId = "";
              if (res.code === 200) {
                that.$message.success("编辑增员成功");
                this.checkPeopleAmount();
                this.searchShebaoInfo();
                this.checkShebaoMethod();
                this.getTopZengJian(); // 增减员顶部统计
              }
            });
          }
        } else if (this.isJCloseMethod) {
          // 编辑减员

          const ids = [];
          ids.push(this.empId);

          var data = {
            planId: this.tempPlanId,
            serviceCost: this.JYserviceCost
          };
          if (this.stopyear !== "" && this.stopmonth !== "") {
            data.month = this.stopmonth;
            data.year = this.stopyear;
          } else if (this.stopGjyear !== "" && this.stopGjmonth !== "") {
            data.month = this.stopGjmonth;
            data.year = this.stopGjyear;
          } else if (this.stopYByear !== "" && this.stopYBmonth !== "") {
            data.month = this.stopYBmonth;
            data.year = this.stopYByear;
          }

          updatajianyuan(data).then((res) => {
            this.progId = "";
            if (res.code === 200) {
              that.$message.success("编辑减员成功");

              this.checkPeopleAmount();
              this.searchShebaoInfo();
              this.checkShebaoMethod();
              this.getTopZengJian(); // 增减员顶部统计
            }
          });
        }
      }
      this.isCloseMethod = false;
      this.defaultCard = 0;
      this.defaultGongjiJin = 0;
      this.isJCloseMethod = false;
    },

    finishEdit2() {
      if (this.zengyuanOrJianyuan) {
        this.isCloseMethod = false;

        if (this.progId || this.progId === "") {
          var param = {
            companyId: this.$store.state.hr.companyId,
            year: this.year,
            month: this.month,
            schemeId: this.progId
          };

          var typeList = [];

          // 增员

          var ids = [];
          this.staffList.map((item) => {
            ids.push(item.id);
          });
          for (var i = 0; i < ids.length; i++) {
            // console.log(ids[i]);
            if (this.addShebao) {
              var newData = [];
              this.formData.map((item, index) => {
                if (item.itemType === 1) {
                  if (this.onlySocAmount) {
                    item.cardinalityDefault = item.cardinalityDefaultAmount; // 固定金额，都复制到比例的技术上
                  }
                  newData.push(item);
                }
              });
              typeList.push({
                companyId: this.$store.state.hr.companyId,
                empId: ids[i],
                empSocPlanItemAddDTOList: newData,
                month: this.month,
                schemeId: this.progId,
                serviceCost: this.serviceCost,
                year: this.year,
                type: 1
              });
            }
            if (this.addYibao) {
              var newData2 = [];
              this.formData.map((item, index) => {
                if (item.itemType === 3) {
                  if (this.onlySocAmount) {
                    item.cardinalityDefault = item.cardinalityDefaultAmount; // 固定金额，都复制到比例的技术上
                  }
                  newData2.push(item);
                }
              });
              typeList.push({
                companyId: this.$store.state.hr.companyId,
                empId: ids[i],
                empSocPlanItemAddDTOList: newData2,
                month: this.month,
                schemeId: this.progId,
                serviceCost: this.serviceCost,
                year: this.year,
                type: 3
              });
            }
            if (this.addGjj) {
              var newData3 = [];
              this.formData.map((item, index) => {
                if (item.itemType === 2) {
                  if (this.onlySocAmount) {
                    item.cardinalityDefault = item.cardinalityDefaultAmount; // 固定金额，都复制到比例的技术上
                  }

                  newData3.push(item);
                }
              });

              typeList.push({
                companyId: this.$store.state.hr.companyId,
                empId: ids[i],
                empSocPlanItemAddDTOList: newData3,
                month: this.month,
                schemeId: this.progId,
                serviceCost: this.serviceCost,
                year: this.year,
                type: 2
              });
            }
          }
          param.empSocPlanAddDTOList = typeList;

          this.confirmLoading = true;
          addEmpSocInfos(param).then((res) => {
            this.Dvisible = false;
            this.confirmLoading = false;
            this.progId = "";
            if (res.code === 200) {
              this.Lvisible = true;

              this.tempDate = res.data;
              this.checkPeopleAmount();
              this.searchShebaoInfo();
              this.checkShebaoMethod();
              this.getTopZengJian(); // 增减员顶部统计
            }
          });
        } else {
          this.$message.success("请选择参保方案");
        }
      } else {
        // 减员
        const ids = [];
        this.staffList.map((item) => {
          ids.push(item.id);
        });
        this.isCloseMethod = false;

        var param2 = {
          companyId: this.$store.state.hr.companyId,
          empIdList: ids
        };
        if (this.jianShebao) {
          param2.stopSoc = true;
          param2.planStopSocMonth = this.stopmonth;
          param2.planStopSocYear = this.stopyear;
        } else {
          param2.stopSoc = false;
        }
        if (this.jianYibao) {
          param2.stopMe = true;
          param2.planStopMeMonth = this.stopYBmonth;
          param2.planStopMeYear = this.stopYByear;
        } else {
          param2.stopMe = false;
        }
        if (this.jianGjj) {
          param2.stopPf = true;
          param2.sealedDateMonth = this.stopGjmonth;
          param2.sealedDateYear = this.stopGjyear;
        } else {
          param2.stopPf = false;
        }
        param2.serviceCost = this.JYserviceCost;
        decEmpSocInfos(param2).then((res) => {
          this.progId = "";

          if (res.code === 200) {
            this.dataDetail4 = res.data;
            this.Lvisible = true;
            this.Dvisible = false;
            this.checkPeopleAmount();
            this.searchShebaoInfo();
            this.checkShebaoMethod();
            this.getTopZengJian(); // 增减员顶部统计
          }
        });
      }
    },
    getStatusTitle() {
      switch (this.tempEmpSocStatus) {
        case 0:
          return "未参保";
        case 1:
          return "正常参保";
        case 2:
          return "取消增员";
        case 3:
          return "取消增员";
        case 4:
          return "取消减员";
        case 5:
          return "取消减员";
        case 6:
          return "停保";
      }
    },
    // 选择参保年份和月份
    onYearMonthChange(date, dateString) {
      const s = dateString.split("-");
      this.year = s[0];
      this.month = s[1];
    },
    // 停供社保
    onStopYearMonthChange(date, dateString) {
      const s = dateString.split("-");
      this.stopyear = s[0];
      this.stopmonth = s[1];
    },
    onStopYBYearMonthChange(date, dateString) {
      const s = dateString.split("-");
      this.stopYByear = s[0];
      this.stopYBmonth = s[1];
    },
    // 封存公积金
    onStopGJYearMonthChange(date, dateString) {
      const s = dateString.split("-");
      this.stopGjyear = s[0];
      this.stopGjmonth = s[1];
    },

    // 增减员计划确认
    onTypeChangeValue(e) {
      this.typeValueTime = e.target.value;
      if (this.typeValueTime === 1) {
        // 保持原定参保时间
      } else if (this.typeValueTime === 2) {
        // 批量更改参保时间
      }
    },
    setGongJiJinContent(val) {
      this.formData.map((item, index) => {
        if (item.itemType === 2) {
          if (this.onlySocAmount) {
            item.cardinalityDefaultAmount = this.defaultGongjiJin;
          } else item.cardinalityDefault = this.defaultGongjiJin;
        }
      });
    },
    editBaseInfoGJ() {
      this.isGongJJBase = false;
    },
    returnEditGJ() {
      this.isGongJJBase = true;
    },
    // 编辑参保各项目基数
    editBaseInfo() {
      this.isShebaoBase = false;
    },
    returnEdit() {
      this.isShebaoBase = true;
    },
    // 查询参保方案
    checkShebaoMethod() {
      getListAllRelation({ companyId: this.$store.state.hr.companyId }).then((res) => {
        this.progNameList = res.data;
        if (this.progNameList.length !== 0) {
          this.defaultFangan = this.progNameList[0].id;
          this.progNameList.map((item) => {
            if (item.id === this.defaultFangan) {
              this.progId = this.defaultFangan;
              this.formData = this.deepCopy(item.socProgItemVOList);
              this.payProvidentFund = item.payProvidentFund;
              this.onlySocAmount = item.onlySocAmount;
              this.siteId = item.siteId;
              this.progKeyId = item.id;

              if (this.currentItem && this.currentItem.schemeName === item.progName && this.currentItem.serviceCost) {
                this.serviceCost = this.currentItem.serviceCost;
              } else {
                this.serviceCost = item.serviceCost ? item.serviceCost : 0;
              }
            }
          });
        }
      });
    },
    // 取消增员或者减员
    remvoeZenyuanOkHandel() {
      this.removeZengVisible = false;
      var that = this;
      if (this.tempEmpSocStatus === 2 || this.tempEmpSocStatus === 3) {
        // 取消增员
        remvoeZenyuanOk(this.tempPlanId).then((res) => {
          that.$message.success("取消增员成功");
          this.getTopZengJian(); // 增减员顶部统计

          this.checkPeopleAmount();
        });
      } else if (this.tempEmpSocStatus === 4 || this.tempEmpSocStatus === 5) {
        // 取消减员
        remvoeJianyuanOk(this.tempPlanId).then((res) => {
          that.$message.success("取消减员成功");
          this.getTopZengJian(); // 增减员顶部统计
          this.checkPeopleAmount();
        });
      }
    },
    // 取消创建参保方案
    handleCancel() {
      this.buchongInfo = false;
      this.confirmPlanTongBu = false;
      this.removeZengVisible = false;
      this.isChooseStaff = false;
      this.isUndoShebao = false;
      this.isUndoShebao2 = false;
      this.isSetting = false;
      this.isCloseMethod = false;
      this.isJCloseMethod = false;
      this.confirmPlanZengVisible = false;
      this.isStopShebao = false;
      this.isConfirmPlan = false;
      this.Dvisible = false;
      this.init(2);
      this.monthYear = "";
    },
    DhandleCancel() {
      if (this.zengyuanOrJianyuan) {
        this.isCloseMethod = true;
      } else {
        this.isJCloseMethod = true;
      }
      this.Dvisible = false;
    },
    DhandleOk() {
      this.confirmLoading = false;
      this.finishEdit2();
    },
    LhandleOk() {
      this.Lvisible = false;
    },
    formatDate(text) {
      return formatDate(text);
    },
    formatDate3(text) {
      const time = formatDate(text);
      const index = time.lastIndexOf("-");
      return time.substr(0, index);
    },
    formatDate2(text) {
      const s = formatDate(text).split("-");
      return s[0] + "-" + s[1];
    },
    getPostType(vl) {
      switch (vl) {
        case 0:
          return "未参保";
        case 1:
          return "正常参保";
        case 2:
          return "增员";
        case 3:
          return "待增员";
        case 4:
          return "减员";
        case 5:
          return "待减员";
        case 6:
          return "停保";
      }
    },
    getEnum() {
      var data = {
        companyId: this.$store.state.hr.companyId
      };
      getEnum(data).then((res) => {
        this.personTypeList = [];
        for (const key in res.data.empPostTypeMap) {
          this.personTypeList.push({
            id: res.data.empPostTypeMap[key],
            value: key
          });
        }
      });
    },
    getTopZengJian() {
      // 增减员顶部统计
      var data = {
        companyId: this.$store.state.hr.companyId
      };

      getTopZengJian(data).then((res) => {
        // 增减员列表
        this.topData[0].num = res.data.allCount || 0;
        this.topData[1].num = res.data.increaseCount || 0;
        this.topData[2].num = res.data.decreaseCount || 0;
        this.topData[3].num = res.data.waitIncreaseCount || 0;
        this.topData[4].num = res.data.waitDecreaseCount || 0;
      });
    },

    onSelectChange(selectedRowKeys) {
      this.selectedRowKeys = [];
      for (var i = 0; i < selectedRowKeys.length; i++) {
        if (!this.dataDetail[selectedRowKeys[i]].feedbackFlag) {
          this.selectedRowKeys.push(selectedRowKeys[i]);
        }
      }
    },

    judgeDefault(item) {
      if (item.id === "1") return "--";
      if (item.cardinalityDefaultAmount !== null) {
        return item.cardinalityDefaultAmount;
      } else return item.cardinalityDefault;
    },
    // 树形图
    tree(array, childKey, onlyLastChild) {
      if (array === null || array.length < 1) {
        return [];
      }
      array.map((item, index) => {
        item["value"] = item.id;
        item["key"] = item.id;
        item["label"] = item.name;
        item["children"] = item[childKey];

        if (item.leave !== 3) {
          item["disabled"] = onlyLastChild;
        }

        if (item.children) {
          this.tree1(item.children, childKey, onlyLastChild);
        }
      });
      return array;
    },
    tree1(array, childKey, onlyLastChild) {
      if (array === null || array.length < 1) {
        return [];
      }
      array.map((item, index) => {
        item["value"] = item.id;
        item["key"] = item.id;
        item["label"] = item.name;
        item["children"] = item[childKey];
        if (item.leave !== 3) {
          item["disabled"] = onlyLastChild;
        }

        if (item.children) {
          this.tree(item.children, childKey, onlyLastChild);
        }
      });
      return array;
    },
    // 停止参保
    deleteShebao() {
      var that = this;
      this.$confirm({
        title: "确认删除",
        content: "确认删除该月份账单？",
        onOk() {
          const data = [that.id];
          deleteEmpSocInfos(data).then((res) => {
            that.$router.go(-1);
          });
        }
      });
    },
    // 设置社保基数
    setAllContent(val) {
      this.formData.map((item, index) => {
        if (item.itemType === 1) {
          if (this.onlySocAmount) {
            item.cardinalityDefaultAmount = this.defaultCard;
          } else item.cardinalityDefault = this.defaultCard;
        }
      });
    },
    // 分页查询
    handlePageChange(pagination, filters, sorter) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.selectedRowKeys = [];
      this.checkPeopleAmount();
    },
    handlePageChange2(pagination, filters, sorter) {
      this.pagination2.current = pagination.current;
      this.pagination2.pageSize = pagination.pageSize;
      // this.getJianYuanList(); // 获取列表
    },
    // 按员工姓名检索
    handleSearch() {
      this.pagination.current = 1;
      this.checkPeopleAmount();
    },
    // 按参保方案检索
    handleProgName(val) {
      this.progIdsear = val;
      this.pagination.current = 1;
    },
    // 增减员类型
    handleType(val) {
      this.type = val;
      this.pagination.current = 1;
    },
    // 计划状态
    handlePlanType(val) {
      this.feedbackFlag = val;
      this.pagination.current = 1;
    },
    // 按照人员类型检索
    handlePersonType(val) {
      this.personType = val;
      this.pagination.current = 1;
    },
    // 按城市检索
    handleCity(e) {
      if (e.value.length > 0) {
        const value = e.value;
        const label = e.label;
        this.socCity = value[value.length - 1];
        this.socCityName = label[0] + "/" + label[1] + "/" + label[2];
      } else {
        this.socCity = "";
        this.socCityName = "";
      }
      this.pagination.current = 1;
      this.checkPeopleAmount();
    },

    // 根据条件不同查询参保人员信息
    async checkPeopleAmount(type) {
      const data = {
        companyId: this.$store.state.hr.companyId,
        pageNo: this.pagination.current,
        pageSize: this.pagination.pageSize,
        nameOrIdCard: this.searchName,
        socCityId: this.socCity,
        socProgId: this.progIdsear,
        type: this.type, // 增减员类型
        feedbackFlag: this.feedbackFlag, // 计划状态
        postType: this.personType // 人员类型
      };
      if (this.jihuaZengJianYuan !== 0) {
        data.planIncreaseOrDecreaseDate = this.jihuaZengJianYuan;
      }
      // {增员: 2, 减员: 4, 未参保: 0, 停保: 6, 正常参保: 1, 待增员: 3, 待减员: 5}
      if (this.active !== 0) {
        if (this.active === 1) {
          data.empSocStatus = 2;
        } else if (this.active === 2) {
          data.empSocStatus = 4;
        } else if (this.active === 3) {
          data.empSocStatus = 3;
        } else if (this.active === 4) {
          data.empSocStatus = 5;
        }
      }

      await increaseOrDecreaseListHeadReq(data)
        .then((res) => {
          this.columnDetail = buildColumnsDetail(res.data);
        })
        .catch((err) => {
          console.log("increaseOrDecreaseListHeadReq", err);
        });

      this.columnDetailNoAction = this.columnDetail;

      getTopZengJianList(data).then((res) => {
        this.pagination.total = res.data.entityCount;
        res.data.entities.forEach((element, index) => {
          res.data.entities[index].socOrStopSocDate = new Date(
            res.data.entities[index].year + "-" + res.data.entities[index].month + "-01"
          ).getTime();
          res.data.entities[index].empSocItemVOList = res.data.entities[index].itemList;
        });

        for (var i = 0; i < res.data.entities.length; i++) {
          if (res.data.entities[i].empSocItemVOList !== null) {
            for (var j = 0; j < res.data.entities[i].empSocItemVOList.length; j++) {
              res.data.entities[i].empSocItemVOList[j].itemType = res.data.entities[i].type;
            }
          }
        }
        this.dataDetail = res.data.entities;
        if (this.dataDetail === null && this.pagination.current !== 1) {
          this.pagination.current -= 1;
          this.checkPeopleAmount(type);
        }
      });
    },
    // 添加参保选择员工
    onEmployeeSelectChange(ids) {
      this.staffList = ids;
      this.editPlan = false;
      var empIds = [];
      this.staffList.map((item) => {
        empIds.push(item.id);
      });
      if (this.zengyuanOrJianyuan) {
        // 增员
        this.isCloseMethod = true;
        getEmpSocImport(empIds).then((res) => {
          if (res.data) {
            this.socImport = res.data.socImport;
            this.pfImport = res.data.pfImport;
            this.meImport = res.data.meImport;
          }
          this.serviceCost = 0;
          if (this.progNameList.length !== 0) {
            this.defaultFangan = this.progNameList[0].id;
            this.progNameList.map((item) => {
              if (item.id === this.defaultFangan) {
                this.progId = this.defaultFangan;
                this.formData = this.deepCopy(item.socProgItemVOList);
                this.payProvidentFund = item.payProvidentFund;
                this.onlySocAmount = item.onlySocAmount;
                this.siteId = item.siteId;
                this.progKeyId = item.id;

                this.verifyImport();
                if (this.currentItem && this.currentItem.schemeName === item.progName && this.currentItem.serviceCost) {
                  this.serviceCost = this.currentItem.serviceCost;
                } else {
                  this.serviceCost = item.serviceCost ? item.serviceCost : 0;
                }
              }
            });
          }
        });
      } else {
        // 减员
        this.isJCloseMethod = true;
        this.JYserviceCost = undefined;
        this.pagination.current = 1;
        this.jianShebao = false;
        this.jianYibao = false;
        this.jianGjj = false;
        this.getJianYuanList(); // 获取列表
        this.getJianYuanJiaoYanList(); // 获取减员校验
      }
    },
    verifyImport() {
      this.useMeImport = false;
      this.useSocImport = false;
      this.usePfImport = false;
      // 校验导入社保数据
      if (this.socImport) {
        var socImportCount = 0;
        let fanganItemCount = 0;
        this.formData.map((item) => {
          if (item.itemType === 1) {
            fanganItemCount += 1;
            // 社保
            for (var val in this.socImport) {
              if (item.itemName === val) {
                socImportCount += 1;
              }
            }
          }
        });
        var socICount = 0;
        for (var val in this.socImport) {
          socICount += 1;
        }

        // 保证所有的子项一样，并且子项的数量一样
        if (socICount === socImportCount && fanganItemCount === socICount) {
          this.formData.map((item) => {
            if (item.itemType === 1) {
              this.useSocImport = true;
              // 社保
              for (var val in this.socImport) {
                if (item.itemName === val) {
                  item.cardinalityDefault = this.socImport[val];
                }
              }
            }
          });
        }
      }
      // 校验导入公积金数据
      if (this.pfImport) {
        var pfImportCount = 0;
        let fanganItemCount = 0;
        this.formData.map((item) => {
          if (item.itemType === 2) {
            fanganItemCount += 1;
            for (var val in this.pfImport) {
              if (item.itemName === val) {
                pfImportCount += 1;
              }
            }
          }
        });
        var pfICount = 0;
        for (var a in this.pfImport) {
          pfICount += 1;
        }
        // 保证所有的子项一样，并且子项的数量一样
        if (pfICount === pfImportCount && fanganItemCount === pfICount) {
          this.formData.map((item) => {
            if (item.itemType === 2) {
              this.usePfImport = true;

              for (var val2 in this.pfImport) {
                if (item.itemName === val2) {
                  item.cardinalityDefault = this.pfImport[val2];
                }
              }
            }
          });
        }
      }
      // 校验导入医保数据
      if (this.meImport) {
        var meImportCount = 0;
        let fanganItemCount = 0;
        this.formData.map((item) => {
          if (item.itemType === 3) {
            fanganItemCount += 1;
            for (var val in this.meImport) {
              if (item.itemName === val) {
                meImportCount += 1;
              }
            }
          }
        });
        var meICount = 0;
        for (var v in this.meImport) {
          meICount += 1;
        }
        // 保证所有的子项一样，并且子项的数量一样
        if (meICount === meImportCount && fanganItemCount === meICount) {
          this.formData.map((item) => {
            if (item.itemType === 3) {
              this.useMeImport = true;
              // 社保
              for (var vl in this.meImport) {
                if (item.itemName === vl) {
                  item.cardinalityDefault = this.meImport[vl];
                }
              }
            }
          });
        }
      }
    },
    getJianYuanJiaoYanList() {
      this.stopyear = "";
      this.stopmonth = "";
      this.stopGjyear = "";
      this.stopGjmonth = "";
      this.stopYByear = "";
      this.stopYBmonth = "";

      this.jianShebao_2 = false;
      this.jianYibao_2 = false;
      this.jianGjj_2 = false;

      if (!this.jianShebao_2) {
        this.stopyear = "" + this.year;
        this.stopmonth = this.month;
      }
      if (!this.jianGjj_2) {
        this.stopGjyear = "" + this.year;
        this.stopGjmonth = this.month;
      }
      if (!this.jianYibao_2) {
        this.stopYByear = "" + this.year;
        this.stopYBmonth = this.month;
      }
    },
    getJianYuanList() {
      const ids = [];
      this.staffList.map((item) => {
        ids.push(item.id);
      });
      var data = {
        empIdList: ids,
        pageNo: this.pagination2.current,
        pageSize: this.pagination2.pageSize
      };
      getJianYuanList(data).then((res) => {
        this.pagination2.total = res.data.entityCount;
        this.dataDetail2 = res.data.entities;
      });
    },
    // 确认
    goDetail(value) {
      this.currentItem = value;
      // console.log(this.currentItem);
      this.typeValueTime = 1;
      if (value.empSocState === 2 || value.empSocState === 3) {
        this.defaultFangan2 = 0;
        this.accModel = false;
        this.shebaoLogin.accountName = null;
        this.shebaoLogin.isLogin = null;
        this.shebaoLogin.accountId = null;
        this.shebaoLogin.areaName = null;
        // 增员确认
        this.confirmPlanZeng = true;
        this.feedbackContent = "";
        this.annex = "";
        this.isConfirmPlan = true;
        this.biaoji = "计划反馈";
        this.dataDetail3 = [];
        this.dataDetail3.push(value);
        const s = this.formatDate(value.socOrStopSocDate).split("-");
        this.year = s[0];
        this.month = s[1];
      } else if (value.empSocState === 4 || value.empSocState === 5) {
        // 减员确认
        this.confirmPlanZeng = false;
        this.feedbackContent = "";
        this.annex = "";
        this.isConfirmPlan = true;
        this.dataDetail3 = [];
        this.dataDetail3.push(value);
        const s = this.formatDate(value.socOrStopSocDate).split("-");
        this.stopyear = s[0];
        this.stopmonth = s[1];

        const t = this.formatDate(value.sealedDate).split("-");
        this.stopGjyear = t[0];
        this.stopGjmonth = t[1];
      }
    },
    getJump() {
      if (this.jumpId.length !== 0 && this.jumpMonth.length !== 0 && this.jumpYear.length !== 0) {
        return this.jumpYear + "年" + this.jumpMonth + "月的";
      } else {
        return "";
      }
    },
    // 确定更改状态
    confirmOk() {
      if (this.biaoji === "计划同步") {
        if (this.defaultFangan2 === 0) {
          this.$message.error("请选择城市");
          return;
        }
        getToken(this.$store.state.hr.companyId)
          .then((res) => {
            if (res.data) {
              this.SyncHandle();
            } else {
              this.accModel = true;
              this.isConfirmPlan = false;
            }
          })
          .catch((err) => {
            this.$message.error("失败!");
            console.log("debug log --> ", err);
          });
      } else {
        var ids = [];
        this.dataDetail3.map((item) => {
          ids.push(item.empId);
        });
        var list = [];
        this.dataDetail3.map((item) => {
          list.push(item.id);
        });
        var data = {
          executeResult: this.typeValueTime,
          companyId: this.$store.state.hr.companyId,
          socPlanIdList: list
        };
        data.feedbackContent = this.feedbackContent;
        data.annex = this.annex;
        if (this.confirmPlanZeng) {
          // 增员确认
          increaseConfirm(data).then(async (res) => {
            if (list.length === 1) {
              await this.loadFabkuiDetail(list[0]);
            }
            this.confirmPlanZengVisible = true;
            this.tempDate = res.data;
            this.isConfirmPlan = false;
            this.selectedRowKeys = [];
            this.checkPeopleAmount();
            this.getTopZengJian();
          });
        } else {
          // 减员确认
          decreaseConfirm(data).then(async (res) => {
            if (list.length === 1) {
              await this.loadFabkuiDetail(list[0]);
            }
            this.confirmPlanZengVisible = true;
            this.tempDate = res.data;
            this.isConfirmPlan = false;
            this.selectedRowKeys = [];
            this.checkPeopleAmount();
            this.getTopZengJian();
          });
        }
      }
    },
    confirmPlanOkHandel() {
      // 关闭弹窗-增减员确认后
      this.confirmPlanZengVisible = false;
    },
    // 增减员确认
    ZongjianyuanSure() {
      if (this.selectedRowKeys.length === 0) {
        this.$message.success("请勾选要反馈增员或减员的人员");
        return;
      }
      let zengyuan = 0; // 1增员，2//减员
      let next = true;
      this.dataDetail3 = [];
      for (var i = 0; i < this.selectedRowKeys.length; i++) {
        if (!this.dataDetail[this.selectedRowKeys[i]].feedbackFlag) {
          if (this.dataDetail[this.selectedRowKeys[i]].empSocState === 2 || this.dataDetail[this.selectedRowKeys[i]].empSocState === 3) {
            // 增员
            if (zengyuan === 0 || zengyuan === 1) {
              zengyuan = 1;
              this.confirmPlanZeng = true;
              this.dataDetail3.push(this.dataDetail[this.selectedRowKeys[i]]);
            } else {
              next = false;
              break;
            }
          } else if (
            this.dataDetail[this.selectedRowKeys[i]].empSocState === 4 ||
            this.dataDetail[this.selectedRowKeys[i]].empSocState === 5
          ) {
            // 减员
            if (zengyuan === 0 || zengyuan === 2) {
              zengyuan = 2;
              this.confirmPlanZeng = false;
              this.dataDetail3.push(this.dataDetail[this.selectedRowKeys[i]]);
            } else {
              next = false;
              break;
            }
          } else {
            zengyuan = 3;
            next = false;
            break;
          }
        } else {
          next = false;
          break;
        }
      }

      if (next) {
        // 打开界面
        const nowDate = new Date();
        if (this.confirmPlanZeng) {
          this.year = "" + nowDate.getFullYear();
          this.month = nowDate.getMonth() + 1;
          if (this.month < 10) {
            this.month = "0" + this.month;
          }
        } else {
          this.stopyear = "" + nowDate.getFullYear();
          this.stopmonth = nowDate.getMonth() + 1;
          if (this.stopmonth < 10) {
            this.stopmonth = "0" + this.stopmonth;
          }
          this.stopGjyear = "" + nowDate.getFullYear();
          this.stopGjmonth = this.stopmonth;
        }
        this.feedbackContent = "";
        this.annex = "";
        this.isConfirmPlan = true;
        this.biaoji = "计划反馈";
      } else {
        this.dataDetail3 = [];
        this.$message.success("仅允许批量反馈增员或者减员，请检查后，重新勾选");
      }
    },
    // 编辑
    edito(value) {
      this.currentItem = value;
      this.tempPlanId = value.id;
      this.empId = value.empId;
      this.JYserviceCost = value.serviceCost;
      this.tempEmpSocStatus = value.empSocState;
      this.editPlan = true;
      if (this.tempEmpSocStatus === 2 || this.tempEmpSocStatus === 3) {
        // 增员编辑
        this.isCloseMethod = true;
        this.serviceCost = 0;
        const s = this.formatDate(value.socOrStopSocDate).split("-");
        this.year = s[0];
        this.month = s[1];

        this.empSocState = value.empSocState;
        for (const item of this.progNameList) {
          if (item.progName === value.schemeName) {
            this.formData = this.deepCopy(item.socProgItemVOList);
            this.defaultFangan = item.id;
            this.payProvidentFund = item.payProvidentFund;
            this.onlySocAmount = item.onlySocAmount;
            if (this.currentItem && this.currentItem.schemeName === value.schemeName) {
              this.serviceCost = this.currentItem.serviceCost ? this.currentItem.serviceCost : 0;
            } else {
              this.serviceCost = item.serviceCost ? item.serviceCost : 0;
            }
            var newData = [];
            this.currentItem.empSocItemVOList.map((item2) => {
              for (var i = 0; i < this.formData.length; i++) {
                if (item2.itemType === this.formData[i].itemType && item2.itemName === this.formData[i].itemName) {
                  newData.push(item2);
                }
              }
            });
            this.formData = newData;
            break;
          }
        }
      } else if (this.tempEmpSocStatus === 4 || this.tempEmpSocStatus === 5) {
        // 减员编辑
        this.isJCloseMethod = true;

        if (value.type === 1) {
          this.stopyear = value.year;
          this.stopmonth = value.month;
          this.stopGjyear = "";
          this.stopGjmonth = "";
          this.stopYByear = "";
          this.stopYBmonth = "";
        } else if (value.type === 2) {
          this.stopyear = "";
          this.stopmonth = "";
          this.stopGjyear = value.year;
          this.stopGjmonth = value.month;
          this.stopYByear = "";
          this.stopYBmonth = "";
        } else if (value.type === 3) {
          this.stopyear = "";
          this.stopmonth = "";
          this.stopGjyear = "";
          this.stopGjmonth = "";
          this.stopYByear = value.year;
          this.stopYBmonth = value.month;
        }
      }
    },
    cancelZengY() {
      // 取消增员
      this.removeZengVisible = true;
      this.isCloseMethod = false;
    },
    cancelJianY() {
      // 取消减员
      this.removeZengVisible = true;
      this.isJCloseMethod = false;
    },
    // 选择在职员工按钮
    chooseOnWork() {
      this.isChooseStaff = true;
    },

    // 增员
    piLiangDaoRu() {
      this.init(2);
      this.addShebao = false;
      this.addYibao = false;
      this.addGjj = false;
      this.zengyuanOrJianyuan = true;
      this.editPlan = false;
      this.chooseOnWork();
      this.currentItem = null;
    },

    // 减员
    toSetshebao() {
      this.init(2);
      this.zengyuanOrJianyuan = false;
      this.editPlan = false;
      this.chooseOnWork();
    },
    btzengyuan() {
      this.$router.push({
        path: "/shebao/shebaoMethod/import",
        query: { title: "批量增员" }
      });
    },
    btjianyuan() {
      this.$router.push({
        path: "/shebao/shebaoMethod/import",
        query: { title: "批量减员" }
      });
    },
    goback() {
      this.$router.go(-1);
    },
    closeDrawer() {
      this.isShowShebaoInfo = false;
      this.init(1);
    },
    // 深拷贝，解决引用赋值
    deepCopy(arr) {
      const newArr = [];
      arr.forEach((item, index) => {
        const record = {};
        for (const k in item) {
          record[k] = item[k];
        }
        newArr.push(record);
      });
      return newArr;
    },

    // 改变社保基数
    changeDefault(val, index) {
      this.formData[index].cardinalityDefaultAmount = val;
      this.formData[index].cardinalityDefault = val;
    },
    // 处理减员月份
    handleCutMonth(val) {
      this.cutMonth = this.monthYear.substring(5, 7);
      this.cutYear = this.monthYear.substring(0, 4);
    },
    getEmpSocImport(itemType) {
      getEmpSocImport(itemType).then((res) => {});
    },
    getCityAcc(value) {
      this.defaultFangan2 = value;
      this.spinning = true;
      getCityAcc({ areaId: this.defaultFangan2 })
        .then((res) => {
          for (var i = 0; i < res.data.length; i++) {
            if (res.data[i].accountType === "社保") {
              this.shebaoLogin = res.data[i];
              if (this.shebaoLogin.isLogin) {
                this.danweiList = [];
                this.code = 0;
                registrationUnit(this.defaultFangan2).then((res) => {
                  res.data.map((item) => {
                    var i = {
                      id: item.aaa102,
                      value: item.aaa103
                    };
                    this.danweiList.push(i);
                  });
                });
                getShebaoToken(this.defaultFangan2).then((res) => {
                  window.postMessage(
                    {
                      ear_cookie: res.data,
                      type: "cookie"
                    },
                    "*"
                  );
                });
              }
            } else if (res.data[i].accountType === "医保") {
              this.yibaoLogin = res.data[i];
            } else if (res.data[i].accountType === "公积金") {
              this.gongjijinLogin = res.data[i];
            }
          }
          this.spinning = false;
        })
        .catch((err) => {
          this.$message.error("失败!");
          this.spinning = false;
          console.log("debug log --> ", err);
        });
    },
    // 创建参保选择方案
    chooseProgName(value) {
      this.defaultFangan = value;
      console.log(this.defaultFangan);
      console.log(this.progNameList);
      this.progNameList.map((item) => {
        if (item.id === this.defaultFangan) {
          this.progId = this.defaultFangan;
          this.formData = this.deepCopy(item.socProgItemVOList);

          this.payProvidentFund = item.payProvidentFund;
          this.onlySocAmount = item.onlySocAmount;
          this.siteId = item.siteId;
          this.progKeyId = item.id;
          this.verifyImport();
          if (this.currentItem && this.currentItem.schemeName === item.progName) {
            // console.log("ooooooo", this.currentItem.serviceCost);
            this.serviceCost = this.currentItem.serviceCost ? this.currentItem.serviceCost : 0;

            if (this.editPlan) {
              this.formData = this.currentItem.empSocItemVOList;
              console.log("ooooooo");
              console.log(this.formData);
            }
          } else {
            this.serviceCost = item.serviceCost ? item.serviceCost : 0;

            // console.log("vvvvv", item.serviceCost);
            // console.log(this.currentItem.empSocItemVOList);
            if (this.editPlan) {
              console.log("vvvvvvvvv");
              var newData = [];
              if (this.currentItem.empSocItemVOList.length !== 0) {
                for (var i = 0; i < this.formData.length; i++) {
                  if (this.currentItem.empSocItemVOList[0].itemType === this.formData[i].itemType) {
                    newData.push(this.formData[i]);
                  }
                }
              }

              this.formData = newData;
              console.log(this.formData);
            }
          }

          this.addShebao = false;
          this.addYibao = false;
          this.addGjj = false;
          this.jianShebao = false;
          this.jianYibao = false;
          this.jianGjj = false;
        }
      });

      let d = -1;
      let d2 = -1;
      for (var i = 0; i < this.formData.length; i++) {
        const item = this.formData[i];
        if (item.itemType === 1) {
          // 社保
          if (this.onlySocAmount) {
            if (d === -1) {
              d = item.cardinalityDefaultAmount;
            }
            if (d !== item.cardinalityDefaultAmount) {
              // 展开
              this.isShebaoBase = false;
              return;
            }
          } else {
            if (d === -1) {
              d = item.cardinalityDefault;
            }
            if (d !== item.cardinalityDefault) {
              // 展开
              this.isShebaoBase = false;
              return;
            }
          }
        } else if (item.itemType === 2) {
          // 公积金
          if (this.onlySocAmount) {
            if (d2 === -1) {
              d2 = item.cardinalityDefaultAmount;
            }
            if (d2 !== item.cardinalityDefaultAmount) {
              // 展开
              this.isGongJJBase = false;
              return;
            }
          } else {
            if (d2 === -1) {
              d2 = item.cardinalityDefault;
            }
            if (d2 !== item.cardinalityDefault) {
              // 展开
              this.isGongJJBase = false;
              return;
            }
          }
        }
      }
    },
    // 编辑员工参保信息选择方案
    chooseEditProgName(value) {
      this.progNameList.map((item) => {
        if (item.id === value) {
          this.progId = item.socProgItemVOList[0].progId;
          this.formData = this.deepCopy(item.socProgItemVOList);

          // this.socProgAddDTO = item

          this.onlySocAmount = item.onlySocAmount;
          this.payProvidentFund = item.payProvidentFund;
        }
      });

      let d = -1;
      let d2 = -1;
      for (var i = 0; i < this.formData.length; i++) {
        const item = this.formData[i];
        if (item.itemType === 1) {
          // 社保
          if (this.onlySocAmount) {
            if (d === -1) {
              d = item.cardinalityDefaultAmount;
            }
            if (d !== item.cardinalityDefaultAmount) {
              // 展开
              this.isShebaoBase = false;
              return;
            }
          } else {
            if (d === -1) {
              d = item.cardinalityDefault;
            }
            if (d !== item.cardinalityDefault) {
              // 展开
              this.isShebaoBase = false;
              return;
            }
          }
        } else if (item.itemType === 2) {
          // 公积金
          if (this.onlySocAmount) {
            if (d2 === -1) {
              d2 = item.cardinalityDefaultAmount;
            }
            if (d2 !== item.cardinalityDefaultAmount) {
              // 展开
              this.isGongJJBase = false;
              return;
            }
          } else {
            if (d2 === -1) {
              d2 = item.cardinalityDefault;
            }
            if (d2 !== item.cardinalityDefault) {
              // 展开
              this.isGongJJBase = false;
              return;
            }
          }
        }
      }
    },
    // 查询总体员工社保信息
    searchShebaoInfo() {
      const data = {
        monthId: this.id,
        companyId: this.$store.state.hr.companyId,
        year: this.year,
        month: this.month
      };
      getAmount(data).then((res) => {});
    },
    // 初始化编辑基数的表单
    init(type) {
      this.formData = [];
      this.isShebaoBase = true;
      this.isGongJJBase = true;
      if (type === 1) {
        this.dataDetail.map((item) => {
          if (item.id === this.keyId) this.evprogName = item.progName;
        });
      }
      if (type === 2) {
        this.evprogName = "";
      }
    }
  }
};
</script>

<style lang="less" scoped>
.revset {
  padding-left: 24px;
  padding-right: 24px;
  padding-top: 0px;
  padding-bottom: 0px;
  background-color: #fff;
}
.rowdialog {
  display: flex;
  flex-direction: row;
  width: 100%;
  align-items: center;
}
.rowdalog2 {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.brow {
  display: flex;
  flex-direction: row;
  width: 200px;
}
.renyuanxinxi {
  border: 1px solid var(--primary);
  color: var(--primary);
  padding-left: 10px;
  width: 80px;
  height: 33px;
  vertical-align: middle;
  text-align: center;
}
.liangge {
  width: 80px;
  height: 33px;
  vertical-align: middle;
  text-align: center;
  padding-left: 12px;
}

.divshu {
  display: flex;
  align-items: center;
  background: #ffffff;
}
.divshu2 {
  width: 1px;
  height: 57px;
  line-height: 50px;
  text-align: center;
  background: #ccc;
  position: relative;
}
.number2 {
  color: #55565d;
  font-size: 24px;
  font-weight: bold;
}
.titlen {
  color: #9c9c9c;
  font-size: 10px;
}
.mothleft {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  height: 100%;
  width: 20%;
  padding-right: 20px;
}
.staff-top-item {
  width: 19%;
  border-radius: 8px;
  display: flex;
  height: 86px;
  position: relative;
  cursor: pointer;
  background-color: var(--primary);
}
.staff-top-item2 {
  width: 19%;
  border-radius: 8px;
  display: flex;
  height: 86px;
  position: relative;
  cursor: pointer;
  background-color: #fafafa;
}
.staff-top2-right {
  width: 80%;
  display: flex;
  height: 100%;
}
.staff-top2 {
  width: 20%;
  display: flex;
  height: 100%;
  position: relative;
  cursor: pointer;
  padding-left: 50px;
}
.staff-top-item-name {
  color: #767885;
  font-size: 14px;
}
.staff-moth {
  color: #3c3d43;
  font-size: 24px;
  font-weight: bold;
}
.staff-top-item-num {
  color: #55565d;
  font-size: 24px;
  // font-weight: bold;
}
.staff-top-h {
  padding-left: 5px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
}
.staff-top-item-left {
  width: 100%;
  height: 95%;
  display: flex;
  // justify-content: center;
  flex-direction: row;
  align-items: center;
  border-radius: 8px 8px 8px 8px;
  background-color: #fafafa;
}
.card-wrapper {
  margin-top: 15px;
  width: 100%;
  flex-direction: row;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.left2 {
  display: flex;
  flex-direction: row;
}
.headbackg {
  display: flex;
  height: 30px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.ant-dropdown .ant-dropdown-menu-item,
.ant-dropdown .ant-dropdown-menu-submenu-title {
  padding: 10px 16px 10px 24px;
}
.ant-dropdown-menu-item:hover,
.ant-dropdown-menu-submenu-title:hover {
  color: var(--primary);
}
.headbttw {
  display: flex;
  height: 50px;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: 20px;
}
.head {
  margin-bottom: 20px;
}
.pageName {
  span {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: rgba(232, 232, 232, 1);
    border-radius: 50%;
    margin-right: 10px;
  }
}
.typeList {
  width: 100%;
  height: 100px;
  display: flex;
  justify-content: space-between;
  border: 1px solid #eee;
  padding: 22px;
  margin-top: 20px;
}
.modal-box {
  padding: 20px 30px 30px;
  text-align: center;
  .set-btn {
    margin-top: 40px;
  }
}
.content-box {
  margin-top: 48px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  .icon-box {
    text-align: center;
    .img-box {
      margin-bottom: 24px;
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
}
.expend-box {
  display: flex;
  justify-content: flex-start;
  position: relative;
  left: -30px;
}
.userInfo-box {
  width: 28%;
  border-right: 1px solid #eee;
  text-align: center;
  .userInfo-baseInfo {
    width: 100%;
    padding: 0px 60px;
  }
  .baseInfo-box {
    margin-left: -20px;
    padding: 15px 0;
    text-align: center;
    width: 100%;
    // border-bottom: 1px dashed #000;
    .avatar {
      margin-bottom: 15px;
    }
    .name {
      margin-bottom: 5px;
    }
  }
}
.userInfo-shebaoInfo {
  width: 100%;
}
.shebaoInfo {
  width: 100%;
  padding: 15px;
  margin-left: -20px;
  background-color: #f7f7f7;
  .idCardInfo,
  .personshebaoInfo,
  .sfInfo,
  .cityInfo,
  .methodInfo {
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-size: 14px;
    margin-bottom: 8px;
    span {
      overflow: hidden;
    }
    .text {
      font-size: 12px;
      text-align: left;
      color: #a6a8b4;
      width: 80px;
    }
    .number {
      font-size: 12px;
      text-align: right;
    }
  }
}
.editInfo-box {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding: 20px;
  button {
    margin-right: 6px;
    margin-bottom: 14px;
  }
}
.total-pay-box {
  width: 80%;
}
.marginL1 {
  color: #a6a8b4;
  font-size: 10px;
  margin-top: -10px;
  margin-left: 250px;
}
.marginL2 {
  color: #a6a8b4;
  font-size: 10px;
  margin-top: -10px;
  margin-left: 342px;
}
.payInfo-box {
  width: 72%;
}
.total-pay-box {
  display: flex;
  justify-content: space-between;
  padding: 16px;
  .totalPay {
    color: #252525;
    font-size: 14px;
    font-weight: 600;
  }
  .pay-box {
    display: flex;
    justify-content: space-between;
    .person-pay {
      margin-left: 32px;
    }
    .com-pay {
      margin-left: 80px;
    }
    .total-pay {
      margin-left: 80px;
      margin-right: 32px;
    }
  }
}
.drawer-box {
  .baseInfo-title {
    padding: 14px 24px;
    background: rgba(250, 250, 250, 1);
    border-radius: 4px;
    height: 48px;
    margin-bottom: 24px;
  }
  input {
    margin-left: 20px;
  }
}
.undoShebao {
  padding: 48px 130px;
}
.shebao-base-box {
  width: 100%;
  background: #e8e8e8;
  margin: 24px 0;
  .base-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding: 12px;
    background: #e8e8e8;
    border-bottom: 1px solid #eee;
    span {
      margin-left: 5px;
    }
  }
  .baseInfo {
    padding: 24px 0 24px 56px;

    input,
    span {
      margin-left: 40px;
    }
  }
  .baseInfo-box {
    padding: 24px 0 12px 24px;
    input,
    span {
      margin-left: 10px;
    }
  }
}
.top_warp {
  display: flex;
  align-items: center;
  img {
    margin-right: 8px;
  }
  .top_number {
    font-size: 24px;
    font-family: DINAlternate-Bold, DINAlternate;
    font-weight: bold;
    color: #55565d;
  }
  .top_title {
    font-size: 14px;
    font-family: SourceHanSansCN-Regular, SourceHanSansCN;
    font-weight: 400;
    color: #767885;
  }
}
.baseInfo-item {
  display: flex;
  flex-flow: row;

  justify-content: center;
  margin-bottom: 10px;
}

.baseInfo-item3 {
  display: flex;
  flex-flow: row;
  width: 100%;
  margin-bottom: 10px;
}
.baseInfo-item2 {
  width: 100%;
  display: flex;
  flex-flow: column;

  margin-bottom: 10px;
}
.toChoose {
  width: 50%;
}
.alreadyChoose {
  width: 50%;
}
.choose-type-box {
  display: flex;
  flex-flow: column;
  align-items: center;
  &:hover {
    cursor: pointer;
    color: var(--primary);
  }
  .chooseType {
    margin-bottom: 3px;
  }
}
.exiset-box {
  .title {
    span {
      color: rgba(250, 80, 81, 1);
      margin-right: 5px;
    }
    font-size: 18px;
  }
  .member {
    margin-top: 20px;
    font-size: 18px;
    font-weight: 600;
  }
  .name {
    margin-top: 20px;
    color: var(--primary);
    font-weight: 600;
    font-size: 18px;
    span {
      color: #000;
    }
  }
}
.seleted {
  color: var(--primary);
  display: flex;
  flex-flow: column;
  align-items: center;
}
.headerTitle {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 15px;
  width: 250px;
  .block {
    width: 3px;
    height: 17px;
    background-color: var(--primary);
    margin-right: 9px;
    margin-top: 3px;
  }
  .title-info {
    font-size: 15px;
    color: #252525;

    font-weight: 700;
  }
}
.edit {
  color: var(--primary);
}
.rowdalog2 {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.dataInfo2 {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.onwork {
  background-color: #faf9f9;
  border-radius: 10px;
  border: 1px solid #e8e8e8;
  padding: 16px 16px;
  display: flex;
  flex-flow: column;
  // align-items: center;
  width: 40%;
}
.modal-box2 {
  margin-bottom: 20px;
  text-align: center;
  .set-btn {
    margin-top: 40px;
  }
}

.employee-selector-wrapper2 {
  display: flex;
  flex-direction: row;
  width: 100%;
  .employee-selector-block {
    width: 400px;
    .employee-selector-title {
      width: 100%;
      height: 32px;
      line-height: 32px;
      font-size: 14px;
    }
    .employee-selector {
      height: 400px;
      margin-top: 20px;

      overflow: auto;
      .employee-selector-item {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-top: 10px;
      }
    }
  }
  .employee-selector-block2 {
    width: 100%;
    .employee-selector-title {
      width: 100%;
      height: 32px;
      line-height: 32px;
      font-size: 14px;
    }
    .employee-selector {
      height: 500px;
      margin-top: 20px;
      padding-right: 10px;
      overflow: auto;
      .employee-selector-item {
        width: 100%;
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-top: 10px;
      }
    }
  }
}
.employee-selector {
  height: 360px;
  margin-top: 2px;
  padding-right: 10px;
  margin-bottom: 10px;
  overflow: auto;
}
.tree-item {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: center;
  cursor: pointer;
  margin-top: 10px;
}
.verticalBar {
  width: 1px;
  background: #e8e8e8;
  display: inline-block;
  vertical-align: top;
  margin-right: 15px;
  margin-left: 5px;
  html,
  body,
  #app {
    height: 100%;
  }
}
.employee-selector-block2 {
  width: 400px;
  .employee-selector-title {
    width: 100%;
    height: 32px;
    line-height: 32px;
    font-size: 14px;
  }
  .employee-selector {
    height: 500px;
    margin-top: 20px;
    padding-right: 10px;
    overflow: auto;
    .employee-selector-item {
      width: 100%;
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      margin-top: 10px;
    }
  }
}
</style>
